# szpp-judge フロントエンド開発をやってみよう【概要】 - 想定読者 React ちょっと分かるけど Next は分からんくらい - 資料 「[リクルート新人研修資料](https://speakerdeck.com/recruitengineers/nextjs-2022)」から一部を抜粋して進めます。 - 内容 - 前半 - szpp-judge 開発環境のセットアップ - React.js の読み書き(ほとんど省略) - Next.js を使って szpp-judge/frontend を書く上で知らないと困るところの解説 - 後半 - szpp-judge/frontend の画面設計してみよう - 目標 - szpp-judge とは何か、登場人物とそれらのあれこれがちょっと分かる - JavaScript はだいたい分かってる人が React の方言を知る - React は分かるけど Next.js のエコシステムは知らんって人が、こんな感じかーって分かる - szpp-judge/frontend の開発に参画したくなる - おことわり React.js を勉強することよりも、なんかよく分からんけど Next.js での開発の雰囲気は分かるかも？という感触がつかめることを目標にしています。 Next.js にしかない便利機能やある種のローカルルールが登場します。これは Web ページの見た目を司っている React.js より Next.js がもっと包括的なフレームワークであるからです。 そのエコシステムに乗っかるためには致し方ないのです。そのため純粋な React.js っぽい書き方をする部分については必要最低限にしており、Next.js 以外では使えない話が登場することをことわっておきます。