nextjs

TECH STAND #5 ~React Native & React~ 2021/07/28 イベントレポート

TECH STAND #5 ~React Native & React~ 2021/07/28 イベントレポート

こちらは、2021年07月28日に開催した「TECH STAND #5 React Native & React」のイベント登壇内容をまとめた記事です。 当日のYoutube Liveアーカイブ動画はこちらからご覧ください! アフタートーク / 質疑応答アフタートークでは、視聴者のみなさんから頂いた質問に答えたり、ディスカッションをしました。たくさんの質問をいただき、各社のReact Native, Reactでの開発面において、悩みどころや知見を共有する有意義な時間となり

5
💁‍♀️ 明日朝 8:00 に「(非エンジニア向け) notion-blog-nextjs で Notion をヘッドレス CMS にしたブログを開設する (Notion API)」という記事を公開します!

💁‍♀️ 明日朝 8:00 に「(非エンジニア向け) notion-blog-nextjs で Notion をヘッドレス CMS にしたブログを開設する (Notion API)」という記事を公開します!

5
(非エンジニア向け) notion-blog-nextjs で Notion をヘッドレス CMS にしたブログを開設する (Notion API)

(非エンジニア向け) notion-blog-nextjs で Notion をヘッドレス CMS にしたブログを開設する (Notion API)

こんにちは、円谷です。表題にもある通り、今日は notion-blog-nextjs という Notion をヘッドレス CMS にしたブログの紹介をしたいと思います。CMS が Notion で、フロントエンドが Next.js というアーキテクチャでブログを開設することができるというものです。 This is a Next.js blog using Notions Public API. とのことで、Notion の公式 API を使った Next.js のテンプレ

6
380
2021-07-20

2021-07-20

microCMS + Next.js のブログ構築にトライしてみている。 ひとまず、microCMS公式のチュートリアル記事を写経して、動作させるところまでは到達。 ただ、「ここは何をしてるのか分からん」とか「この書き方でなんでこうなるのか理解できん」なところが何箇所かあるので、Next.js のリファレンスにも立ち戻って、理解できる形に書き直したりしている。 getStaticProps とか getStaticPaths とか、間隔が空いてうろ覚えになってしまった。

React の フレームワーク、Next.js に入門!

React の フレームワーク、Next.js に入門!

# はじめにNext.js は本番環境のための React フレームワークで主に以下のような特徴があります。 1. 画像最適化 2. 国際化ルーティング 3. Next.js アナリティクス 4. ゼロコンフィグ 5. ハイブリッド SSG・SSR 6. ISR(Incremental Static Regeneration) 7. TypeScript サポート 8. ファスト・リフレッシュ 9. ファイルシステムルート 10. API ルーティング 11. ビルトイン

1
500
Next.jsでglobal.css設定

Next.jsでglobal.css設定

サイト全体でCSSを効かせたいときは、 global.cssを設定する。 pages/_app.js にて、 import '../styles/style.css'function MyApp({ Component, pageProps }) { return <Component {...pageProps} />}export default MyApp ../styles/style.css(<--- stylesフォルダに入れる) の部分を自分が作ったCSS

Next.js×microCMSでポートフォリオサイトを作った

Next.js×microCMSでポートフォリオサイトを作った

はじめに少し前にNuxt.jsで作成したポートフォリオサイトをNext.jsに作りなおしました。 上記の記事では、Nuxt.js → Next.jsへの移行の話がメインだったので、作成したポートフォリオサイトの技術構成等をnoteで書いていこうかなと思います。 技術構成・Next.js ・TypeScript ・Chakra UI ・microCMS ・Vercel デザインUI コンポーネントライブラリにChakra UIを使用しています。 Modalなど素

Next.jsとmicroCMSでシンプルなポートフォリオサイトを作った

Next.jsとmicroCMSでシンプルなポートフォリオサイトを作った

今年のはじめにNext.jsとmicroCMSをつかって自分のポートフォリオサイト的なものを作ってみました。 Next.jsのチュートリアルほぼそのままで作れるので、自分でそういうサイト作ってみたいなーと思っている人にはオススメです。 (まぁ今の時代NoCodeで十分な気もする) せっかくなのでやったことをまとめておきます。 完成品↓ はじめに:やりたいこと 要件としては、 ・独自ドメインを使った自己紹介サイトの作成がしたい ・ポートフォリオサイトらしく自分の経験(

29
Next.js+Vercel+microCMSでブログを作る

Next.js+Vercel+microCMSでブログを作る

どうも。 Next.jsとmicroCMSでブログを作ったのでその時の話を残しておこうと思います。 作っていく上で色々とハマりポイントがあったことや、実際にmicroCMSやNext.jsをガッツリ使った思いなど残していこうと思います。 今回作ったもの ・microCMSを使ってAPI経由でデータを取得する。 ・新着一覧・カテゴリ一覧・各ページ・カテゴリページ(ページネーション有りのページ)一覧を作る。 ・getStaticPathsとgetStaticPropsをつかって

Django REST Framework + Next.js + NextAuth Google認証システム構築

Django REST Framework + Next.js + NextAuth Google認証システム構築

Django REST Framework と Next.js、NextAuthでGoogle認証システムを構築していきます。 NextAuthを使用すると簡単に認証システムが構築できます。 目標下記を学習していきます。 ・Next.js、NextAuth で Google ログイン認証構築 ・DRF でユーザーのアクセストークンの更新 動画チュートリアル動画でも解説しています。 ぜひ参考にして下さい。 機能・Google 認証 ・プロフィール画面 解説記事フィ

3