副業でWeb制作を始めたいなら、ポートフォリオサイトは必須だと思う。
「実績がないと案件が取れない。でも案件がないと実績が作れない。」CrowdWorksに登録してすぐ、この地獄のループに気づいた。あれ、詰んでる？と思った。
でも考えてみたら、作ったアプリが3本あった。それを見せるポートフォリオサイトを作ればいい。今回はAIの力を借りて1日で公開するまでの話を書いていきます。
ポートフォリオサイトって何？なぜ必要なの？
簡単に言うと、「自分の作品集ページ」のこと。
就活でいう履歴書みたいなもの。「こんなアプリ作れます、こんな技術使えます」を伝える場所。
CrowdWorksで案件を取るには、実績ゼロの状態が一番しんどい。でも実績がなくても、動くアプリがあれば「見てください」と言える。
私の場合、これまでに3本のWebアプリを開発していた。
- 家計簿アプリ
- タスク管理アプリ（Kanban）
- 収支管理アプリ
これをまとめて見せるページを作ることにした。
AIと一緒に作ってみた。思ってたより全然速かった
正直、「サイト一個作るだけでも1週間はかかるんじゃ…」と思っていた。
あれ、思ってたのと全然違う。基本の構成は数十分で完成してしまった。
Reactというプログラミングの仕組みを使い、デザインも整った状態で出てきた。Reactというのは、Webサイトを効率よく作るための道具のこと。初心者には難しく聞こえるが、今回はAIが全部書いてくれたので問題なし。
ページの構成はこんな感じ。
- ヘッダー：名前とCrowdWorksへのリンク
- トップ画面：自己紹介とスキル一覧
- 制作実績：3本のアプリカード（デモリンク・GitHub付き）
- スキル：使える技術の一覧
- お問い合わせ：CrowdWorksへ誘導
デザインもそれっぽい。自分で一から作ったらこうはならない。めちゃくちゃ助かった。
作ってみて気づいたこと：つまずきは3回あった
順調に見えて、実はいくつかつまずいた。
①スクリーンショット問題
3本のアプリのスクショを撮ってページに貼ったのだが、Kanbanアプリのスクショが暗くてほぼ何も見えない状態に。タスクが何も入っていない空っぽの画面を撮っていたのが原因。
AIに「これ見づらいですよ」と指摘されて撮り直した。データが入っている状態のスクショは大事。当たり前だけど、言われるまで気づかなかった。
②アプリのバグ発見
Kanbanアプリで「期限を入れないとタスクが保存されない」というバグを発見。AIに調べてもらったら、空欄のまま送信すると日付のデータ形式が合わなくてエラーになっていたのが原因。2行のコード修正で直った。
むしろポートフォリオを作る過程でバグを直せた。一石二鳥。
③公開作業でつまずいた
GitHubというコード管理サービスにファイルを送ったとき、不要なフォルダも一緒に送ってしまっていた。それが原因でNetlify（ネットリファイ／Webサイトを無料で公開できるサービス）のビルドが失敗。エラーの内容は全部英語で、最初は何のこっちゃわからなかった。
AIに「これは◯◯が原因で、こうすれば直ります」と日本語で説明してもらって解決。英語のエラーをAIが翻訳してくれるのは本当に助かる。
かかった時間と完成したもの
トータルで半日くらい。
完成したのがこちら → https://hirobuilds-portfolio.netlify.app
CrowdWorksのプロフィールにもURLを貼った。実績ゼロでも「動くアプリ3本あります、見てください」と言える状態になった。
ゼロから自分でやったら何週間もかかったと思う。AIがあれば、プログラミングの深い知識がなくてもこのレベルのものが作れる時代になっている。
あなたも作ったものがあるなら、まず見せる場所を作ることから始めてみてほしい。
次回は、このポートフォリオを武器に実際の案件に応募してみた話を書く予定。果たして案件は取れるのか。お楽しみに。
コメント