【Web制作】初案件を終えて

2020年1月からWeb制作にどっぷりはまり、20年9月に退職してWeb制作フリーランスとして活動しています。

本記事では、僕がどのように初案件を受けてどのようなことを行ったのかを備忘録もかねて残しておきます。

初案件受注までの流れ

結論から言うと、知人のエンジニアから案件を獲得致しました。 獲得までの背景を書いていきますね。

わたしは、海外ボランティアでアフリカのタンザニアという国で2年間ほど体育教師として働いていたんですね。

海外ボランティアの仲間には、いろいろな職種の方がいてそのなかにPHPエンジニアの方がいました。

当時はそこまで繋がりがあったわけではなかったですが、ありがたいことにTwitterで学習を発信していたところ、見つけていただき声をかけてくれました。

本業では、PHPエンジニアとして活躍している方で副業として最近Web制作を行っているようで す。
「やってみる？」 といわれ「やります！！」 といった流れで案件獲得になりました。

正直かなりラッキーでしたね。あんまり再現性ない初案件の獲得ですが、今までの繋がりって非常に大切だなと思いますね。

最近では、大学時代にお世話になったカフェの店長が連絡をくれてホームページ制作の相談を受けました。

お前は特殊な環境でラッキーで案件もらっただけやろと言う声も聞こえそうですが、もし仮にわたしがTwitterで発信をしていなかったらどうでしょう？

何が伝えたいかというと「ガンガン発信していきましょう！」ということです。

初のイラストレーターに苦戦

さぁ受けた案件についてご紹介していきます。

• イラストレーターでデータ
• githubで進捗を管理してもらう
• WordPress案件でページ数は6ページ
• レスポンシブ必須

イラストレーターもgithubも使ったことがなくてかなり苦戦しました。

Githubは知人がやり方を教えてくれたのでかなり救われましたね。ただイラストレーターについて自分で必死こいて調べましたね。

特にこちらの記事はかなり参考にしました。

また、イラストレーターって有料なんですがこちらも知人のアカウントを使わせていただきました。本当感謝です。

ローカル環境で構築

WordPress案件でしたので開発環境が必要です。オンラインスクールデイトラでは、MAMPを使って開発をしていたのですが、Local by Flywheelです！今回の案件でもLocalを使って開発を進めましたが全く問題なかったですね。

こちらの記事を参考にしてみてください！

PHPファイルにコーディング

学習段階では、まずはhtmlファイルを作成して静的サイトを完成させてからPHPファイルに置き換えていたんですね。

でも、今回はブランクファイルをダウンロードしてPHPファイルに直接コーディングしていきました。こんなやり方あるのかぁと目が点になりました。

どっちの方がオススメかと言われると難しいですが、PHPファイルに直接書き込んでいくとパスの書き換えが不要なので楽ですね！

あと、ブランクファイルに既に参考となるコードが載っているので、コーディングの助けになるかと思います。

ただ、1点気をつけないといけないのが、scssを使ってコーディングする人も多いと思いますが、プラグインを入れないとコンパイルされません。 別途プラグインを入れる必要があります。

こちらの記事を参考にしてみてください。

実際、コーディングをしていて思ったのは意外といけるなってことですね。

普通にWordPressでテーマ開発をした経験があればいけます。もちろんその都度調べることは山ほどありますが無理なレベルではないです！

特にデイトラの上級編の卒業制作を終えている方であれば、安心して案件受けちゃって問題ないです。

気をつけるべき点

案件を受けてみてもっとこうしておけばよかった点が下記になります。

画像ファイルで対応するところを事前に決める

まずデザインをみて、「これはコーディングすると複雑になる」とあたりをつけることが大切かなと思いました。

実際に無理やりコーディングしようとしたんですがどうしても再現できず（特にレスポンシブが絡むと）結局画像で対応したところがありました。

ただデザイナーさんも全然いいよーと言ってくれたので、もっと早い段階から相談しておけばよかったなと思いました。

もちろん、全てコーディングで表現できればいいんですが難しいところもあるかと思います。

なるべく早い段階からどちらで対応するかを決定して工数を減らしましょう！

投稿数が増えたときにページネーションが機能するか確認する

また、これは完全にプロとして失格なんですがブログ一覧で投稿数が増えたときにページネーションの機能をつけると思います。

もちろんローカル環境で確認はしたんですが、本番環境のWordPressの設定の変更が必要だったんですがデザイナーさんに伝えておらず。

納品後に連絡が来て、ページネーションが機能していませんと、、。

すぐに対応したんですが、やっぱりこの辺りもしっかり対応できてこそプロだなと思うので今後は気をつけたいと思います。

今後の案件に向けて

無事初案件を終えた感想ですが、

「調べればいけるかな」って感じですね！

どうしても機能的に難しいやつとかはあるんですが、そんときはMENTAとかのサービスを使って乗り越えましょう！

とりあえずちょっとわからないこともあるけど、いけそうだなと思える案件についてはガンガントライしていきましょう。

今後の案件については、さらに品質について気を付けていきたいなと思いました。
あとは、最初にデザインをみて使い回しができそうなところを抽出してscssの@extendやmixinをもっと使いこなしたい。

もっとコーディングのスキルをつけて効率化をしていきガンガン案件を回せるようになっていきたいですね。