【30DAYSトライアル1st】ポートフォリオ編

30DAYSトライアル ポートフォリオ編Web Development

30DAYSトライアル ポートフォリオ編

2019年にTwitterから誕生した格安オンラインプログラミングサービスの「デイトラ」の先駆けとなった「30DAYSトライアル1st」のポートフォリオ編(Day18からDay20)の課題をまとめた記事です。

Day18からDay20の3日間でポートフォリオを作成します。いままでの課題とは違って受け身の姿勢ではなく、積極的的に手を動かして自分のサイトを完成させていきましょう。

スポンサーリンク

30DAYSトライアル1st・ポートフォリオ編(Day18からDay20)

DAY18からDAY20の課題は「ポートフォリオを制作して公開すること」です。

たった3日間で自分を売り込むためのポートフォリオサイトを制作して公開まで行うので、いままでの課題とは違って受け身で課題をこなしているだけでは完了できない課題構成になっています。

それではひとつひとつ課題を見ていきましょう★

Day18: HTMLテンプレートを使ってみる・ポートフォリオサイト製作

Day18の課題

 

Day18の感想

HTMLテンプレートの種類の豊富さはすごいです。オススメされているCanvas(Canvas | The Multi-Purpose HTML5 Template)がどんなものか確認してみたら、素敵なデザインばかりでデモサイトを見ているだけで楽しめました。

しかし私はテンプレートを使ってサイトを作る前に、まずはテンプレートを使わずにサイトを作ってみたかったので、今回のポートフォリオ製作は今回の30DAYSトライアルで身に付けた力で作ってみることにしました。

30DAYSトライアルポートフォリオまとめファイルから先輩方の作品を確認して

  • ポートフォリオにはどんな内容が必要か
  • 文章(テキスト)は何を書くか
  • 全体の構成はどうするか

などのアイディアをずべて紙に書き出して考えをまとめました。

30DAYSトライアル ポートフォリオサイトまとめ - Google スプレッドシート

Day19: ポートフォリオサイト製作(続き)

Day19の課題

 

Day19の感想

テンプレートを使わずに30DAYSトライアルで身に付けた力でポートフォリオを作ると決めたので、今自分ができることを総おさらいしました。

そして、Bootstrap編のDAY13からDAY16に制作したLPサイトのテクニックを使うことに決め、動画を見直したり、Bootstrapのドキュメントを参照しながらサイトを作り上げました。

製作時間を計測していなかったのでどれくらい時間がかかったかはわからないのが残念なので、次サイトを制作する時は時間も計測しようと思います。

Bootstrap編の記事はこちら↓

【30DAYSトライアル1st】Bootstrap編
2019年にTwitterから誕生した格安オンラインプログラミングサービスの「デイトラ」の先駆けとなった「30DAYSトライアル1st」のBootstrap編(Day11からDay17)の課題をまとめた記事です。 DAY11からDAY17ではCSSのフレームワークで有名な「Bootstrap」の学習をします。環境構築編で準備したローカル環境を使い、「Bootstrap」を使ってLP作成をしていきます。

Day20: ポートフォリオサイトを公開

Day20の課題

 

Day20の感想

私の場合ポートフォリオはFirebaseのhostingを使って公開したのでサーバー契約・ドメイン取得・FTP関連はややりませんでした。

Firebaseでのサイト公開方法はYoutubeにあった動画を参考に行ったので無料でWeb上に自分のポートフォリオサイトを公開することができました。

参考にした動画はこちら↓

 

ちなみに、ドットインストールの有料会員であればドットインストールでもレッスンがありました↓

Firebaseでウェブサイトを公開してみよう (全9回) - プログラミングならドットインストール
FirebaseのHosting機能を使って、HTML/CSS入門で作成したウェブサイトを公開する方法について見ていきます。

まとめ

公開できた私のポートフォリオがこちら↓(アイキャッチがうまくいってないですね。。。)

Yaponka's portfolio
30DAYSトライアル1stの課題として作成しましたYapokaのポートフォリオです。是非ご覧下さい。

自分の作ったサイトがローカル環境からでなく、Web上からアクセスして見えるようになったのでとても感動しました!

コードがうまく動いてくれない時などどうしたらいいか分からなくて辛いこともありますが、これからも30DAYSトライアルを続けて嬉しい成功体験を増やしていきましょう★