BETA

Web素人が無理せず作るポートフォリオ

投稿日:2018-12-07
最終更新:2018-12-07

はじめに

はじめまして。
情報系を専攻している大学生です。(Twitterはこちら

こちらの記事はWeb系全然わからない素人がポートフォリオを作る過程をまとめたものです。
普通にWebアプリ開発をされる方からしたら「こんな時代もあったなあ」と振り返れるかもわからないレベルです。

環境構築

  • Atom 1.19.2

普段iOSアプリ開発をメインにやっており、Webページの制作経験もないため環境構築からのスタートです。

・・・
・・・

どこから手をつければいいのやら。
ぐぐってもあんまり出てこなくないですか?

結局よくわからなかったのでProgateのHTMLコースにあった環境にしました。

あとは実装

最初はJSを使ってインタラクティブな要素を追加しようと考えていたのですが、作っているとHTMLとCSSだけでもそれっぽいのができてしまいました。

完成したものがこちら。
https://yuzunosuke.github.io/portfolio/

リンクを押すと上のような見た目のページに飛びます。

シンプルなものに仕上げたかったため、使用する色を減らし、余白を大きくとりました。
その反面さすがに地味すぎるか?とも思っていますが・・・

情報量もさほど多くないので、ページを分けたりせずに1ページに全てまとめてしまいました。

つまづきと参考ページ

初めてのWebページ制作で様々なつまづきがあったので、解決してくれたページと合わせて紹介します。

おわりに

初めてWebページを作りました。
といってもめちゃくちゃ簡単でシンプルな最低限のページですが・・・

こんなものでも3日ほどかかってしまいました。
必要な知識が効率よく集まっていればもっと早く出来ていたかと思います。そのためWebページ作りたい気持ちを持っている初心者の方などの参考になってほしいです。

思いの外内容のないものになってしまいましたが、最後まで読んでいただきありがとうございました。

技術ブログをはじめよう Qrunch(クランチ)は、プログラマの技術アプトプットに特化したブログサービスです
駆け出しエンジニアからエキスパートまで全ての方々のアウトプットを歓迎しております!
or 外部アカウントで 登録 / ログイン する
クランチについてもっと詳しく

この記事が掲載されているブログ

@ynskskiの技術ブログ

よく一緒に読まれる記事

0件のコメント

ブログ開設 or ログイン してコメントを送ってみよう