フロントエンドコーディング試験

• 未経験者は 2週間以内
• 経験者は 1週間以内

【課題】

1. RESAS(地域経済分析システム) APIの「都道府県一覧」APIから取得する
2. APIレスポンスから都道府県一覧のチェックボックスを動的に生成する
3. 都道府県にチェックを入れると、RESAS APIから選択された都道府県の「人口構成」を取得する
4. 人口構成APIレスポンスから、X軸:年、Y軸:人口数の折れ線グラフを動的に生成して表示する

• React/Vue.js/Angularのいずれかを用いてSPAを構築すること（バージョンはできるだけ最新版をご使用ください）
• React
• Vue
• Angular
• Nuxt.jsやNext.jsなどの、これらを内包したフレームワークの利用も許可する
• 都道府県一覧および総人口情報はRESAS APIのデータを用いること
• グラフは Highcharts や Rechart.js などのサードパーティ製のグラフライブラリを用いて描画すること
• ただし、グラフライブラリは上記のものに限らず、任意のものを用いてよい
• Google Chrome最新版で正しく動くこと
• PC/スマートフォン表示に対応すること(レスポンシブデザイン対応)
• ただし実機でなく、Google Chromeの検証ツールで確認できればよい
• リンターやフォーマッターを適切に設定すること
• リンターにはESLint、フォーマッターにはPrettierを使用すること
• styleは自分で記述し、CSS・UIフレームワークなどは原則使用しないこと
• ただし、chartライブラリ内包のstyle、リセット系のCSSライブラリについてはこの限りではない
• また、css-in-jsやcss-modules、sassなどのエコシステムの利用を妨げるものではなく、あくまでcssの記述力を測る趣旨に留まる
• リードエンジニア・テックリード応募の場合は、以下も制約に加える
• TypeScriptで記述すること
• テストケース/テストコードを作成すること
• テストツールは任意のものを用いてよい
• テスト実行時にエラーが発生しないこと

• RESAS APIの利用登録(無料)を行い、API Keyを発行する必要がある
• ソースコードはGitで管理し、作成したソースコードはGitHubにアップロードすること
• Netlify / GitHub Pages / Firebase hosting / Vercel 等のホスティングサービスにデプロイし、インターネット経由で閲覧できる状態にし、そのURLを提出時に共有すること
• セキュリティを考慮してコードを記述すること
• アプリのコンポーネント粒度の設計、Gitコミットメッセージやコミット粒度、ドキュメンテーション等もレビュー対象となる
• チーム開発を意識してコードを記述すること

• RESAS API
• RESAS API仕様書
• Highcharts
• Recharts.js

【コードの提出方法】

• GitHub の public リポジトリの URL をお知らせください。
• 別の方法で提出する場合はご相談ください(Git のコミット履歴が分かる形式が望ましいです)。
• 上記の課題とは別のコード(ご自身で公開されているOSS等)をもって課題の提出とすることをご希望の場合はご相談ください。最後に、以下の三点を課題提出の際にお知らせくださいませ。
• 課題の取り組み開始から完了までに要した合計時間
• これまでの総合的なプログラミング歴
• これまでのWEBフロントエンドプログラミング歴