PythonでのWebアプリ開発チュートリアル！スクールなどの学習方法も紹介【Django, Flask, stremlit】
hikarikoubou
テックメンター(TechMentor)ブログ｜未経験からエンジニア転職・案件獲得を目指すプログラミングスクール
【未経験からWeb制作フリーランスへ】習得すべきスキルと案件獲得までの流れを一挙紹介！
yuumi
- Web制作フリーランスになるために、何から学べばいいか分からない
- コーディングを学習してみたが、案件獲得までの方法が分からない
- 情報が溢れすぎていて、どのスキルをどのくらい学習するべきか判断しづらい
今回は、現役Web制作フリーランスである著者の経験を踏まえて、これらの悩みを解決できる記事を用意しました。
この記事で紹介するステップを踏めば、未経験からでもWeb制作フリーランスになることができます。
実際に、私も同様のステップで完全未経験から3ヶ月でWeb制作フリーランスとしてデビューすることができました。
本記事では
- Web制作で案件を獲得ために必要なスキル
- 案件獲得までの流れ
を紹介していきます！
現在は副業フリーランスとしてWeb制作に携わっており、毎月10～15万円ほどの副収入を得ています😊
仕事や育児をしながら副業を始めたい方にも、おすすめの記事となっています。参考になれば嬉しいです♪
目次
習得すべきスキル
Web制作フリーランスになるために、まずはこれらのスキルを身に着けましょう。
- HTML：
- Webページの基礎となる骨格を作るためのマークアップ言語です。見出し・段落・リンクなど、Webページの基本的な要素を作成するために必要です。
- CSS：
- HTMLで作成されたWebページの見た目をデザインするためのスタイルシート言語です。色やフォント・レイアウトなど、Webページの視覚的な部分を制御します。
- JavaScript：
- Webページに動きを追加するためのプログラミング言語です。ユーザーの操作に反応する要素や、動的なコンテンツを作成するために必要です。
- デザインツールの基本操作：
- Figma、Adobe XDなどのツールを使用し、サイトレイアウトの作成を行います。コーディング案件でも、デザインの確認や素材の書き出し等に使用します。
これらはWebページを作成するために、最低限必要な言語です。
ネット上には、教材や学習サイトが溢れているので、それらを活用して学習するのがおすすめです。
私が使用した学習サイトや教材を紹介します。
①Progate
Progateは初心者向けのプログラミング学習サイトです。
要点をまとめたスライドで知識をインプットした後、自分でコードを書いてみて理解を深める、という学習の流れで進めていきます。
基礎からじっくりと学習することができるので、プログラミング未経験者はまずはProgateから始めるのがおすすめです。
Web制作フリーランスを目指す方は
- HTML＆CSS
- JavaScript
- jQuery
- Sass
の学習コースに取り組みましょう。
テンポよく進められるので、楽しく学習できますよ！😊
②ドットインストール
動画でプログラミングを学べる初心者向けのプログラミング学習サービスです。
実際にプログラミングをしている様子や、環境構築のやり方まで3分程度の動画にまとまっているので、実際のWeb制作の流れを理解することができます。
Progateでの学習を終えたら、ドットインストールにチャレンジしてみましょう。
私は以下のレッスンに取り組みました。
- Webサイトをつくれるようになろう
- Webサイトに動きをつけてみよう
初めは難しいと感じていたJavaScriptも、ドットインストールでかなり理解を深めることができました！
③Codestep
CodestepはWeb制作の基本を学習し終えた方向けのコーディング学習サイトです。
架空サイトのデザインが用意されており、それを元にコーディング練習をすることができます。
画面幅に応じて配置を変えるレスポンシブコーディングも学べます。
模写コーディング用のサンプルサイトのソースコードはすべて著作権フリーで、自身でコーディングしたものは制作実績として公開OKです。
全ての課題に取り組む必要はなく、初級編・中級編から2つずつ、上級編から1つ課題を選んでクリアすれば、制作実績としては十分かと思います。
初めは難易度が高く感じますが、諦めずに継続することが大切です！
デザインツールの学習はYoutubeで
一通りコーディング学習を終えたら、次はデザインツールを学習しましょう。
おすすめは操作がシンプルで、無料プランがあるFigmaです。
私はYoutubeで学習し、こちらのチャンネルがとても勉強になったので、リンクを貼っておきます。
Figmaの学習が一番辛かったですが、今ではお気に入りのデザインツールです（笑）とにかく手を動かしてみることが習得への近道だと思います！
学習につまづいてしまった場合は？
学習を続けていると、自分の力だけでは解決できない問題に直面します。
そんなときの解決方法をご紹介します。
teratailを利用する
teratailはプログラミングに特化したQ＆Aサイトです。
会員登録をすると無料で利用できます。
回答率は85.53%（2023年8月時点）と高く、多くのエンジニアが利用しています。
必ず返信が来るとは限りませんが、学習につまづいた時は利用してみるのがおすすめです。
メンターサービスを利用する
特におすすめなのは、メンターサービスを利用することです。
私は、ドットインストールを終えたタイミングで、Web制作フリーランス向けのメンターサービスを利用し始めました。
私が利用したメンターサービスは、
- いつでもメンターに技術的な質問やキャリアの相談ができる
- 案件獲得までのロードマップ作成
- 学習モチベーションの管理
といった内容で、学習後半から案件獲得まで、効率良く進むための後押しになりました。
メンターサービスを利用したことで、分からない問題に必要以上に時間を費やさず、効率的に学習を進めることができました。
私は自分の好きな時間に学習したかったので、いつでも質問できるサービスがついたメンターサービスを選びました。
目的やライフスタイルに合わせて、自分に合ったものを選ぶことが大切だと思います！
以下の記事も参考にしてみてください😊
案件獲得までの流れ
学習を終えた後、案件獲得を達成するまではざっくりと以下のような流れになります。
- ポートフォリオサイトの作成・公開
- クラウドソーシングサイトに登録
- ひたすら営業する
それぞれの項目ついて、詳しく紹介していきます。
ポートフォリオサイトを作成・公開
まずは自分のスキルを証明するための「ポートフォリオサイト」を作成しましょう。
Figmaでデザインを作成
Figmaで1からオリジナルサイトのデザインをします。
ポートフォリオサイトに載せる項目は、以下のようなものがあればOKです。
- プロフィール
- サービス内容（自分ができること）
- 制作実績
コーディング
デザインが終わったら実際にコーディングしていきます。
PC画面でもスマホ画面でも正しくに表示されるように、必ずレスポンシブ対応はしておきましょう。
サーバー契約
ローカル環境でサイトが完成したら、サイトをアップするサーバーを契約しましょう。
私はConoha Wingを契約しました。
サーバーへのアップロードが終わったらをポートフォリオサイトの公開は完了です。
クラウドソーシングサイトに登録
次は、クラウドソーシングサイトを使って案件に応募してみましょう。
ここでは、クラウドソーシングサイトで案件を獲得するコツをご紹介します。
プロフィールを充実させる
プロフィールは、クライアントが自分を信頼して依頼をするために非常に重要です。
以下の項目は必ず記載しましょう。
- プロフィール画像
- 経歴・職歴
- 持っているスキルや得意なこと
- 稼働できる時間帯
- 連絡手段・頻度
- 実績（ポートフォリオサイト）
最低でもこれらの項目を明記しておくことで、クライアントからの信頼が得やすくなります。
誠実さが伝わるような丁寧な文章を心がけるだけでも、クライアントからの返信率がUPします！
他の応募者のプロフィール文や提案文を見て、良いと思ったところを取り入れていきましょう！初めのうちはこまめにブラッシュアップして試行錯誤することが大切です！💡
とにかく営業する
クラウドソーシングサイトに登録したら、あとはWeb制作案件にひたすら応募するだけです。
以下のポイントを抑えて、1日20件を目安に応募しましょう。
返信は早めに
依頼者から返信が返ってきた場合、すぐに返信しましょう。
早く返信することで、真剣さが伝わり、他の多数の応募者との差をつけることができます。
低価格で提案する
実案件での実績がないうちは、依頼者が提示した価格より低い価格で提示することで、契約につながる確率が上がります。
例えば、以下のように
「私はクラウドソーシング上では駆け出しエンジニアのため、今回はご希望の最安値価格から○割引きの○○円で対応させていただきます。」
といった文章を、必ず提案文に書くようにしていました。
クライアント希望価格の半額で提案することもありました（笑）
安すぎて怪しまれそうな場合は、実績作りのために値引きさせていただく旨を伝えることもありました。
提案文のテンプレを活用し、素早く応募する
提案文のテンプレは必ず用意しましょう。
そして、投稿された案件には素早く応募することが大切です。
そうすることで、他の応募者より先に自分の提案やスキルをアピールすることができます。
既にたくさん応募されている案件では、提案文すら読んでもらえない可能性があります。
なるべく応募数が少ない案件に早めに応募することが案件獲得のカギです。
初めのうちは20件応募して1件返信が返ってこればいい方です。心が折れそうになりますが、諦めずにたくさん応募しましょう！
まとめ
Web制作フリーランスになるために必要なスキルと案件獲得までの流れを紹介しました。
独学でも十分に実現可能ですが、最短で実現したい場合はメンターサービスの利用がおすすめです。
テックメンターでは、プログラミング学習を支援するメンターサービスを提供しております。
Tech Mentor Web制作コースの特徴
- 【サブスク型】基本月額制（￥32,780～）
- 現役フリーランスの専属メンターにSlackで質問し放題
- ポートフォリオ作成サポートあり
- 案件・内定獲得まで徹底サポート
- 案件獲得後も納品サポートあり
一人ひとりのレベルに合わせた完全オーダーメイドカリキュラムと徹底したサポート体制で、未経験からの案件獲得・転職者を多数輩出しています。
ABOUT ME
愛犬2匹とコスメをこよなく愛する28歳。
休日はWebサイト作ったり、ブログ書いたり、SNS運用したり...
気ままに働く副業フリーランス。
