自身のGitHubモバイルアプリ内のおすすめに上がってきていた、こちらのリポジトリ。 面白そうなので、React(Next.js)で簡単なWebアプリを作った。 github.com このAPIを使用する https://animechanapi.xyz/documentation/#randomanimechanapi.xyz 実際に書い…

いつも忘れて都度調べている気がしたので、コマンドをメモしておく。 mkdir my-project cd my-project npx create-next-app --example with-typescript . yarn dev あとは localhost:3000 にアクセスすればOK

何度も起きていることだが、下書きフォルダに入れっぱなし案件。 定期的に下書きフォルダ見ていくと、大抵公開忘れのポストがいくつか新たに塩漬けになっている気がする。。 ただ、これは書き捨てて的な文章なので、公開していなかっただけかもしれない。 以…

入力されたパスに応じて、クライアント側でデータを読み込むような処理が書かれたNext.jsアプリをNetlifyにデプロイした際、 実際の挙動が開発時(ローカル)と本番(Netlify)で異なっていたのを対応したので、備忘録として残しておく。 ここで扱っている内容自…

私はNext.js環境で実施したが、npm or yarn が使える環境であれば、特に環境には左右されないかと思う。 使用するのはsitemapというnpmパッケージ。 www.npmjs.com yarn add -D sitemap sitemapに記載したいURLのリストを用意する。 vim listofurls.txt ※サ…

今日Next.jsでアプリを書いていたときに出会ったことをメモする。 といっても、Next.jsはエラーメッセージが親切なので、メモを残さなくとも、対処方法がわかりやすくエラーログに出てくる。 こういうのは本当に素晴らしいなと思う。 エラーの原因を探ってア…

少し前に書いていたもの。ついつい下書きフォルダに忘れがち。。 AMP対応させたページでグラフを動的に表示させるとなると、基本的にJavaScriptは使用できないので、CSSで頑張ることになりそう。 というわけで、Next.js環境で頑張ってみた結果がこれ。 githu…

前に書いていた自身のポートフォリオサイトのこと。 shinshin86.hateblo.jp 前回はNext.js(AMP対応)に移行したことを書いたが、最後に書いていた今後のタスクとして設定したコンテンツのローカライズを少し進めたので、進捗メモがてらこちらにも書いておく。…

以前自身のポートフォリオサイトを作り、AMP対応したことを書いた。 shinshin86.hateblo.jp ちなみに実際のサイトはこちら。 (よろしければ音楽やWEBアプリなど聴いたり見たりしてみてください〜) shinshin86.com 基本的にこのサイトはHTML5 UPのテンプレー…

完全なる自分用メモ(備忘録) 下記を参考にすればOK (Next.jsのAMPのサンプル) github.com 以下のコマンドを順に実行すればAMPのサンプルページが立ち上がる。 あとは localhost:3000にアクセスするだけ。 yarn create next-app --example amp amp-app cd amp…

追記: Google analyticsに関するコードは"pages/_document.js"内に書いたほうが良いかもしれない 以前書いたこちらの記事だが、本文のとおりにやればGoogle Analytics側では正常に認識されるものの(Google Search Consoleでの確認も完了できる)、 どうやら正…

next.jsでreact-notifications用のcssファイルを読み込もうとしたら、Module parse failed: Unexpected character '@' (1:0) というエラーが出た next.jsで書いたアプリに先日書いたreact-notificationsを導入しようとしたら、コンパイル時に下記のようなエ…

完全なる備忘録です。 Next.js 9 with TypeScript セットアップ 最近 Next.js 9 を余暇を利用して触っているので、今回はそちらの環境のセットアップから行います。 ちなみに最初からTypeScriptで書けるように設定していきます。 以前Qiitaに書いたNext.jsで…