カテゴリーアーカイブ 未分類

asaba 著者:asaba

【iosアプリ】ニフティ不動産が出しているアプリが良い!

来年辺りに引っ越しを検討している筆者です。物件探しは何回か経験があるので条件を絞って探すのはお手の物なのですが、各不動産

会社と比較してどこの会社が管理している物件が安いか比較するところは無頓着で後でこっちのほうがやすいじゃん!!みたいな後悔は

何度もしてきました。少し早いですが自分はニフティ不動産の賃貸物件検索アプリを使って物件探しの審美眼を鍛えております、はい。

このアプリは、スーモやアパマンといった大手を中心に管理されている賃貸マンションを不動産別で比較できる不動産版トリバゴみたい

な感じのアプリになっています。ただ探すだけでなく、お気に入り機能を使って同棲したい方と住みたい賃貸を共有したり他のユーザー

が気に入った場所を見ることができます。

 

住む前の事前情報ってすごく大事なのでここはしっかり物件のお見合いをして住む場所を

決めたいですよね。lineでリンクを送信できるので、相談したい方や親しい方と伝達してしっかりと前相談ができるのもスマートですね。

また、このアプリでは引っ越し業者の比較も簡単な仮の見積もりを作ってできます。引っ越し料金が気になるという方はこれを

使ってコストカットできる点も見逃せないのではと思います。

 

語彙力がないのであまり伝わらなかったかもしれないですがどうでしょうか?引っ越したいけどどこがお得なのか分からない、あのサイト

には自分に合った条件の物件がなかったには向いているアプリだと思います。

 

大分脱線してしまいましたが偶の息抜きという感じでみてくださいね、それでは!!!

 

 

  • この記事いいね! (0)
asaba 著者:asaba

cordWriterのちょっとしたバグ

cordWriterは、文字コードやタブのスキップ数などの機能をほぼサイドバーで管理できることが特徴で、更に20つの言語に対応にも

対応している優秀なエディタです。自分も今これを使っています。

 

 

唯一の欠点は、いきなり落ちること。コードをいじっている最中でも保存する寸前でもお構いなしに降りかかってきます。

しかもandroidStudioと違ってその場で保存されないので、ソースツリーなどを使っていない小さなプログラムだと書いたコードが

全てパーになるのでものすごい損害になってしまいます。

他のエディタでは落ちたことはないのですが、自分はcordWriterを使う時のみに限り複数でのエディタを開いたりサイトを開きっぱなし

にしないなど工夫をしてきました。それから頻度は格段に減りましたが、エディタを使っている時に他のサイトを閲覧しようとするとペー

ジを開いた瞬間に落ちてしまったりととにかく負荷にものすごく弱いエディタということは身に染みて理解できました。

また、連続でアプリを起動してもバックグラウンドで負荷がかかるのでこれも避けてください。

タスクマネージャーを起動していればどのアプリが負担をかけているか簡単に検証できるので、cordWriterとでセットで使うと

予防もできて開発効率が上がるのでおすすめです。

 

  • この記事いいね! (0)
村上 著者:村上

【未解決】npm run build実行時に発生した「Failed to minify the code from this file」エラー

今日は現在開発中のアプリで発生したエラーについてです。
なお、タイトルにも書いてある通り未解決です。解決策が分かり次第、またまとめようかと思います。

エラーは「Failed to minify the code from this file」というものです。
表示された情報によると、発生個所は ./node_modules/rss-parser/lib/parser.js:16らしいです。
こちらは、RSS から情報を取得した情報を JavaScriptオブジェクトに変換するために、npm を使って追加したライブラリです。

Google翻訳に掛けたところ、「このファイルからコードを縮小できませんでした」とのこと。
ますます意味が分からない…。

 

調べてみたところ、create-react-app のバージョンが v3.0.0 以降だと、このエラーが表示されるようです。投稿者によると、v2.12.1 では問題なく動作したとのこと。
…が、残念ながら create-react-app は使っていないんですよね…。
React のバージョンも下げればいいのでしょうか?…でも、どのくらいまで下げれば?
残念ながら、まだ該当するような投稿を発見できず…。
まだ調査中です。

が、どうやらこのエラーが発生していても、実行自体はできるようでした。
npm run build 実行後、エラーは発生していましたが、試しにそのまま npm start を実行したところ、エラーは出つつも問題なく動作しました。
…なので、現在は暫定的にその状態で開発を進めています。

ですが、エラーが出るのは気になるので、時間を見つけて、引き続き解決策を探したいと思います!

  • この記事いいね! (0)
asaba 著者:asaba

【cordova-react】画像をBase64で変換しないとTypeError: cyclic object valueで怒られる話

今日は、自分のミスを晒すことで二度と同じコードを書いてしまわないようにと戒めの気持ちで綴ります。

変数の誤字だったり空欄を統一しなかったりしょうもないちょんぼとはまた別のお題になります。

たった今の話になりますが、ある画像をaxiosを使ってサーバーに送ろうとしたときにTypeError: cyclic object valueで怒られてハマって

しまいました。

どうやらサーバーに渡すときにbase64に変換する前にsetStateしてしまったのが原因らしくこれでは何の画像なのか解読不能ですよ

という解釈だと思っています。

以下が自分が誤って書いてしまったコードになります。

<pre>  onImageSelected(e) {
    const file = e.target.files[0];
    const fr = new FileReader();
    fr.onload = () => {
      const preview = document.querySelector('img');
      preview.src = fr.result;
      console.log(preview);
   //ここはダメ!!!!
   this.setState({profImage: preview});
    };
    loadImage.parseMetaData(file, (data) => {
      const options = {
        maxHeight: 1024,
        maxWidth: 1024,
        canvas: true,
      };
      if (data.exif) {
        options.orientation = data.exif.get('Orientation');
      }
      loadImage(file, (canvas) => {
        const dataUri = canvas.toDataURL('image/jpeg');
        const imgNode = document.getElementById('image');
        imgNode.src = dataUri;
        //正しい位置
        this.setState({profImage: dataUri});
      },
      options);
    });
    fr.readAsDataURL(file);
  }
</pre>

ここではloadImageで処理する前に元の形式のままsetStateしてしまっています。onLoadの処理をしている時はまだ画像を変換していない

のでこれでは受け付けてくれないですよね・・・。なのでloadImage関数で確実に変換できているdataUri変数をsetStateしてあげれば

サーバーもうけとってくれるはずです。

画像を指定してサーバーに送ったら動かなくなった又は落ちてしまったという方はcatch内でログを辿ってみてください。

そしてTypeError: cyclic object valueが出てきたらこのブログを頼ってみてください。(そこで解決するかは分かりません!)

 

  • この記事いいね! (0)
asaba 著者:asaba

【cordova-react】componentWillMountが廃止される日

componentWillMountとは、一回だけ呼び出される一連の処理を指しており一般的にはページ更新でよく用いられます。

最近になってReact.jsのライフサイクルの一つであるcomponentWillMountが近いうちに廃止されることを知ったのでリアルタイムで

使っていたので焦って調べたのですが、どうやらリリースをしていくうちにrenderが何度も呼ぶようになってしまい、安定したコンポーネ

ントが維持できなくなるためにこのような措置が取られたみたいです。

React.jsのバージョン16.3ではまだ使うことができるみたいですが、17.0で完全に廃止されてしまうみたいですね。

それでもこのライフサイクルでアプリを作りたい!という方はUNSAFE_componentWillMountメソッドを使ってやり過ごしましょう。

 



UNSAFE_componentWillMount(){

//初回で何らかの処理をしたい時に書きます。

}

UNSAFEは直訳だと安全でないと捉えられるが、セキュリティ上での意味でなく将来リリースするバージョンでバグを引き起こす可能性が

ありますよという意味なので使う分には問題ないみたいです。

 

reactもクラスの書き方だったりライフサイクルが見直されたりと目まぐるしくスタイルが変わっていきますがそれまでに普段から公式マニ

ュアルを見たり各コンポーネントの役割を理解していけば怖くないはずです、はず・・・。

参考にさせていただいたリンクです。↓ 英語です(汗)

What’s new in React 16.3(.0-alpha)

Understanding React — Component life-cycle

 

  • この記事いいね! (0)
takahashi 著者:takahashi

Youtube初の音楽サービス”Youtube Music Premium” 日本版がついに解禁!

以前から度々話題に出ていたYoutube Music Premiumですが、ついに日本版がリリースされたようです。

新しい音楽アプリ、 YouTube Music がはじまります – Google Japan Blog

いままでスマホのYouTubeアプリで音楽を聴く際、Youtubeを開いたまま(画面をonにしたまま)動画とともに流すしかありませんでした。

今回、Youtube Premium/Youtube Music Premium解禁と同時にリリースされたYoutube Musicアプリを、MusicPremiumに契約した状態で使えば、なんとYoutube上の音楽をバックグラウンドで聞けるようになるそうです。

さらにYoutubeとPlayMusicは最終的に統合される予定とのことで、Youtubeに動画として公開されていない音楽もどんどん追加されていくことになりそうです。
他にも、PlayMusicにはなかった音楽PVなどもYoutube Music上で見れるようになっているのも注目したいポイントです。

唯一気になるのがPlayMusicにあった手持ちの音楽もクラウドにアップロードすることで、ネットにつながっていればどこでも視聴ができる”ロッカー”機能がYoutube Musicにも最終的に引き継がれるのが気になる点です。

個人的にも結構重宝している機能なので、Youtube Musicに完全移行になっても残してほしいですね。

  • この記事いいね! (0)
asaba 著者:asaba

【windows10】バッテリーリフレッシュ&診断ツールを実施してみた

windows10を買って一年経つのですが、右下のバーに見慣れない緑色のアイコンがあったので気になってググったところ、どうやら

バッテリー・リフレッシュ&診断という無料のツールでした。

通常のpcは購入して一年経つとウィルスバスターの更新などはよく見かけるようになるのですが、このツールは初めてだったので

よく分からないままクリックすると下のダイアログにたどり着きました。

このツールは、劣化していたバッテリーをリフレッシュさせ、ほぼ最初の状態に回復させてくれる機能を持っています。

自分はほぼpcを繋いでプログラミングをしているので、そこまでバッテリーを酷使した覚えがないのですが停電などでバッテリーを

登板させたときに何かあったらいけないのでしぶしぶ実施することに。というのも実はバッテリーのリフレッシュが完全に終わるまで17時

間もかかってしまい、その間pcが使えなくなってしまうのが嫌であまりやりたくなかったのですが初代富士通FMVみたいにバッテリーが

完全に死ぬ悲劇を繰り返したくなかったので仕方なくです、仕方なく。

これは私事な理由でしたが、pcを長く使いたかったらバッテリーのリフレッシュをすることをお勧めします。

  • この記事いいね! (0)
asaba 著者:asaba

【ESLint】続 ESLintのエラー解釈

前回ログを消して見れなくなったエラーコードですが、新しいファイルをリファクタリングしたらぞろぞろと出てきたのでこの機会に

説明してしまいましょう。ESLintて何?という方は筆者に期待するのはやめてググってみてください。(そっちのほうが賢明)

二つとも簡単なエラーですが国内の資料が見つからないので自分なりの解釈で訳します。例えばこのエラー、コメントアウトの中で

引き起こしたエラーですがパラメーター’e’が行方不明ですよという意味合いになります。


Missing JSDoc for parameter 'e'

これは、後述に書いてある@event~がない時に吐かれるエラーです。イベントハンドラにコメントを付ける際には忘れずにつけて

おきましょう。

 

二つ目は、reactにはprop-typeというパッケージがあり、ESLintを導入するとこれらのパッケージがちゃんとついているかどうかも

検証してくれます。これを怠ると後述のようになります。


‘history’is missing in props validation

historyを使う際には、このprop-typeが必要になってきます。今まで当たり前にできてきたので少々面倒くさいですが、npmで

prop-typeをインストールしてコード一番上にインポートしておいてください。

本日は以上で終わりになってしまいますが、どこかでESLintエラーにまた会うことでしょう。綺麗なコードを書けるように引き続き牙を研

ぎ続けます。

  • この記事いいね! (0)
asaba 著者:asaba

【ESLint】reactにESLintを導入しました

コードの品質とチームで書き方を統一するためにESLintを導入しました。これがあると、規模の大きいコードでもチームで同じ書き方を

することでリファクタリングの効率を上げることができます。

日本語での資料が少ないので、ここで自分の拙い日本語で少しずつエラー詳細を説明していきます。

 

 

一番最初に見かけたエラーがこちらです。直訳するとLFを期待したがCRLFが検出されましたという感じです。


Expected linebreaks to be 'LF' but found 'CRLF'

 

ESLintは改行コードはLFしか認可しないからか分かりませんが、コードエディターではこれが発生しました。

CRLF->LFに変えて保存で治ります。簡単ですが、多分全行コードがこのエラーをもって吐き出されるのですこし労力がいるかもです。

 

自分も最近導入したばかりなのですが、いきなり入れるとエラーが

どんどんでてくるので面食らわずにエラーを解消していってくださいね。

 

すみません、本当はこの後にどんどんエラーを紹介したかったのですが、ログが消えてしまったのと画像を撮り忘れが原因で

載せることができなくなりました。次回以降にエラーが出たらまた紹介していきたいと思います。

 

 

  • この記事いいね! (0)
asaba 著者:asaba

【teratail】teratailで質問する前に抑えておきたいこと

 

teratailはプログラマやSEだけでなく、ネットワークエンジニアやITコンサルタントの方々も利用しているit業界ではトップクラスの

ソーシャルメディアです。スタックオーバーフローと違いこちらは国内のみの質問と回答で構成されており、これまで英語が苦手で

どこに質問していいか分からない、ヤフー知恵袋に投稿したけど同じ分野の人が見ていなくて質問が全く帰ってこないという方々の強い

味方として国内でも信頼されており、自分も去年プログラミングにおいて分からない事だらけで中々コーディングが進まない時に質問

したのですが、大抵は数時間以内に回答が返ってくるので開発スピードも極力落とさずに作ることができました。

また自分はteratailなどのメジャーなソーシャルメディアで投稿している時は、たくさんの人が閲覧しているので質問者としての立場を

忘れずに三つの決まり事を守り続けています。その三か条をざっくり説明していきたいと思います。

 

一つめは、自分がなにをしたいか明確にしておくこと です。

まず、ネットに限らず人に質問をするときは自分の分からない部分を抑えておき、回答者が答えやすいような環境を作ることが大切だと

思っています。何が分からないか分からない状態を放置して質問しても、回答者は分からないポイントがどこなのか見当がつかないので

このようなあやふやな状態で投稿しても恐らく回答が0、若しくは的外れな回答が返ってくることうけあいです。

質問をする前にエラーログを見てどのようなエラーが出ているか確認して、自分が壁に当たっている問題点を洗い出すことがポイントだと

思います。

 

二つめは、自分が試したことを予め書き出しておくこと です。

自分が詰まっている質問に回答がついた、見てみよう!と意気込んで回答を開くと、自分が過去にした解決方法が・・・(しかもそれで解決できなかった)

というパターン。自分もうっかりこのようなミスをしてしまいがっくしきてしまった過去があります。明らかにこちらの情報不足で起こる

事故であり、待った時間が無駄になってしまうので事前に自分が試したことを箇条書きでいいので書き揃えておきましょう。

これなら回答者も詳細を読み取ることができるので、その項目を除いた解決手段が見つかる可能性が高くなります。忘れずに書いておきま

しょう。

 

三つめは、質問をいただいた回答者には必ずお礼をいうこと です。

これはIT技術者以前に社会人としての常識になってしまいますね(汗)自分はqiitaやブログで解決できた時は必ずコメントで一言お礼を

言っています。答えをくださった先人たちには敬意をこめてお礼を言いましょう。日ごろから感謝の気持ちを欠かさずに利用していると、

この方は礼儀正しいし回答もしっかり見ていてくれるからまた困った時は助けてあげよう。と先人の方々もまた気持ちよく受け答えするこ

とができるので後々財産になってくると思います。またteratailではベストアンサーという制度があり、基本は一番の解決の要因となった方

の回答に付与します。答えが役に立った場合は必ずつけてあげましょう。

 

以上が僕がteratailで書き込むときに大切にしていることです。移り変わりの早いこの業界だからこそ情報を共有して助け合うことが

一番の良薬ではないかと考えています。

  • この記事いいね! (0)