ポートフォリオサイトを作成しました
こんにちは、kazutoです。今回は、ポートフォリオサイトを作成したので、軽い報告記事になります。
ポートフォリオ詳細
今回、作成したポートフォリオの名前は、「K-LAB」となります。LABとは、「laboratory」という「実験室」という意味を持つ英単語の一部から文字を抜き取り、命名をしました。「K」は僕の名前のイニシャルです。まとめると、「kazuto laboratory」となり「kazutoの実験室」という意味を持ちます。またサイトのレイアウトは1カラムレイアウト を採用をしており、レスポンシブ対応です。次のトピックでは、各コンポネートごと掲載している情報をもとに掘り下げていきます。
ABOUT



ABOUTは、僕のプロフィール情報が掲載されています。まあ、最低限の個人情報しか載せていません。ご興味がある方は、TwitterでのDM、もしくは、このサイトのコンタクトフォームからお問い合わせください。
上記の画像は上から順に
- PC画面
- タブレット端末
- スマートフォン
のレイアウトです。多少、お使いの端末でレイアウトが変わると思いますが、あらかじめご了承ください。
SKILS



SKILSでは、僕の近況のスキルセットになります。なお、割合に関しては
- 0~40%
→入門レベル、何度かアプリを作成した程度 - 50~70%
→脱入門〜中級レベル、自分で考えてアプリを作成することができる - 80~100%
→実務での経験がある
となっております。
ARCHIBE



ARCHIBEは、これまで作成したオリジナルアプリを掲載をしています。
- WEBアプリケーション
- チャットボット
- ゲーム
- RPA
など様々なジャンルのアプリケーションを作成しました。他にも色々とアプリは、ありますが、抜粋して掲載をしています。


画像をクリックすると上記の画像の様なポップアップが表示されます。中身は、
- アプリ名
- 説明
- リンク(DEMO、GitHub、ブログ)
- 使用技術
を記載しています。まあ、簡単なアプリの紹介です。更に詳しく内容を確認したい方は、各種リンクに飛んでください。Git Hubには、アプリのソースコードが保管されていますので、git cloneコマンドを実行してローカル環境で試してみてください。
CONTACT



CONTACTは、コンタクトフォームになります。何かご不明な点がありましたら、こちらのフォームからお問い合わせください。

お問い合わせいただくと上記の画像の通り、自動返信メールが届きますので、ご確認ください。もし、メールが届かない場合は、再度コンタクトフォームからメールアドレス等をご入力ください。
※自動返信メールが届かない場合
再度、コンタクトフォームからお問い合わせをして、自動返信メールが届かない場合は、僕のTwitterのアカウント宛てにDMしてください。
SNS



SNSは、僕が利用しているSNSのアカウントを掲載しています。ご興味がある方は、気軽に覗いてみてください。
まとめ:ポートフォリオサイトを作成しました
今回は、僕が作成したポートフォリオサイト「K-LAB」の紹介記事でした。あまり、HTML/CSSについて学習する機会があまり無かったので、良い勉強になりました。完成したポートフォリサイトを確認したい方は、下記のリンクからご参照してください。
※使用技術
- PHP 7.0
- phpunit/phpunit 6.5
- phpmailer/phpmailer 6.2
- Composer 2.0.8
- npm 6.14.4
- node 14.2.0
- jquery 3.5.1
- jest 26.6.3
- jsdom 16.4.0
以上、kazutoでした。