技術ブログ– category –
-
Next.js とSupabaseで求人マッチングアプリを作る③～企業のプロファイル変更～
前回に引き続き、求人マッチングアプリの制作方法をご紹介します！ 先日作ったマスタデータに対して、UIを追加していきます。今回は、以下のような『企業の基本情報を変更する』UIを追加しましょう。この記事をベースに、UI作成・DBとの紐づけを習得してみ... -
Next.js とSupabaseで求人マッチングアプリを作る①～ユーザ認証～
今回からNext.jsとSupabaseを利用して求人マッチングアプリを作成します。 現在求人マッチングアプリに、大きな注目が集まっているのはご存知でしょうか？IT業界をはじめ多くの企業が人手不足となっており、企業は採用に多大なコストと労力を支払っていま... -
Next.js とSupabaseで求人マッチングアプリを作る②～マスターデータ設定～
今回は前回の記事に続き、今後必要となるマスターテーブル群を作成していきます。 Supabaseの`Table Editor`を開き、下記の順序で設定してください。（外部キーの関係上順番通りに作成しないとエラーになる可能性があるため注意） Supabaseは、この通りイ... -
Next.js とSupabaseで求人マッチングアプリを作る④～求職者のプロファイル変更～
今回は前回の記事の続きで、『求職者の基本情報を変更する』UIを追加します。基本的な流れは『企業のプロファイル変更』と同じです。なのでもし自学目的で見ておられる方は、企業プロファイルのコードを見ながら、求職者部分のUI実装を行ってみてください... -
Next.js とSupabaseで求人マッチングアプリを作る⑤～求人募集の登録・修正機能～
今回は前回の続きで求人募集の登録・修正機能とそのUIを追加します。 これも『企業のプロファイル』『求職者のプロファイル』と同じように実装したいところですが、少し違う点があります。例えば『"新規作成"と"既存求人の編集"の切り替え』や『作成・編集... -
Next.js とSupabaseで求人マッチングアプリを作る⑥～企業一覧、企業詳細情報～
今回から一覧系ページ、詳細系ページの作成を進めます！ 具体的には 企業一覧 企業詳細 求職者一覧 求職者詳細 求人一覧 求人詳細 になります。今回は企業一覧と企業詳細を作成します。単に情報取得・表示だけでなく、ポリシーの調整も含まれているため、... -
Next.js とSupabaseで求人マッチングアプリを作る⑦～求職者一覧、求職者詳細情報～
今回は求職者一覧と求職者詳細を作成します。 企業一覧 企業詳細 求職者一覧 求職者詳細 求人一覧 求人詳細 おおよそ前回の流れと一緒なので、もし自学目的であれば、前回のコードを見ながら作ってみたあと、答え合わせをしても面白いかもしれません。それ... -
Next.js とSupabaseで求人マッチングアプリを作る⑧～求人一覧、求人詳細情報～
ここまで作ってきたマッチングアプリも、だいぶ形になってきましたね。今回は求職者一覧と求職者詳細を作成します。 企業一覧 企業詳細 求職者一覧 求職者詳細 求人一覧 求人詳細 これも求職者一覧・求職者詳細と同じ形で作成ができるので、作り方をマスタ... -
Next.js とSupabaseで求人マッチングアプリを作る⑨～企業、求職者情報、求人のファイルを追加できる仕組み作成～
今回は、今まで作成してきた各種編集画面にファイルアップロードの機能を搭載し、アップロードしたファイルのURLをDBに保存する仕組みを作成します。 マッチングアプリにおいて、画像アップロード機能はほぼ必須です。求人を行う企業の雰囲気を掴んでもら... -
Next.js とSupabaseで求人マッチングアプリを作る⑩～検索機能～
さて、一覧・詳細画面が一通り完成した訳ですが、残りマッチングアプリに必要な機能とはなんでしょうか。 それは『検索機能』です。たとえ沢山の求人や求職者が登録されていたとしても、ユーザーが見たいのは『条件に合う』リストだけです。なので、今回は...
