【ITニュース解説】My FIRST EVER PORTFOLIO website

2025年09月07日に「Dev.to」が公開したITニュース「My FIRST EVER PORTFOLIO website」について初心者にもわかりやすいように丁寧に解説しています。

作成日: 更新日:

ITニュース概要

筆者はHTML、CSS、JavaScriptを使い、初のポートフォリオサイトを2週間で制作した。研修応募には間に合わなかったものの、GitHubの利用やYouTubeでの学習を通じて多くのWeb開発の学びを得た。シンプルな技術で多様なデザインが可能と知り、今後の学習への意欲を高めている。

出典: My FIRST EVER PORTFOLIO website | Dev.to公開日:

ITニュース解説

ある開発者が、自身の初めてのウェブデザインプロジェクトとして、ポートフォリオウェブサイトを制作した。このウェブサイトは、これまでに習得したスキルや成果物を紹介するためのものであり、主にHTML、CSS、そしてVanilla JavaScriptという技術を使って構築された。ポートフォリオサイトは、IT業界を目指す人にとって、自身の能力や実績を具体的に示すための非常に重要なツールとなる。

このプロジェクトの最初の目的は、ソフトウェア開発者の見習いプログラムに応募することだった。しかし、制作過程で応募締め切りに間に合わず、またJavaScriptというプログラミング言語の理解をさらに深める必要があると感じたため、最終的にプログラムへの応募は見送られた。しかし、応募できなかったことに対する後悔はなく、むしろこの経験自体が、自身のスキルアップのための貴重な機会だったと捉えている。

ウェブサイトの制作期間は約2週間だった。短期間での開発ではあったものの、この経験は開発者にとって非常に教育的であり、多くの新たな発見があったと述べられている。ゼロから実際のウェブサイトを構築する過程で、理論だけでは得られない実践的な知識や課題に直面し、それを解決する経験を積むことができた。

使用された技術について詳しく説明する。HTML(HyperText Markup Language)は、ウェブページの構造を作るための言語である。例えば、ウェブサイトのタイトル、見出し、段落、画像、リンクといった要素を配置し、情報の骨組みを定義する役割を果たす。CSS(Cascading Style Sheets)は、HTMLで定義された構造に対して、色、フォント、配置、レイアウトなどの見た目を装飾する言語である。これにより、ウェブサイトは視覚的に魅力的で、ユーザーにとって使いやすいデザインとなる。そして、Vanilla JavaScriptは、JavaScriptというプログラミング言語を、特別なライブラリやフレームワークを使わずに直接利用することを指す。JavaScriptは、ウェブサイトに動的な動きやインタラクティブな機能を追加するためのプログラミング言語である。例えば、ボタンをクリックしたときに表示される内容を変えたり、アニメーションを動かしたり、フォームの入力チェックを行ったりするなど、ユーザーの操作に応じた様々な処理を実現する。これらの基本的な技術を組み合わせることで、単なる情報の表示にとどまらない、よりリッチなウェブ体験を提供できる。

さらに、このプロジェクトではGitHubというツールを初めて使用した。GitHubは、プログラマーが自分の作成したプログラムコードを保存・管理し、変更履歴を記録したり、他の開発者と共有したりするためのウェブサービスである。チームでの共同開発を効率的に進める上で不可欠なツールであり、コードのバージョン管理やバックアップにも役立つ。初めてのGitHub利用で、まだ操作に戸惑う部分もあったようだが、この経験を通じてその重要性を理解したと考えられる。

この制作体験を通じて、開発者はYouTubeがプログラミング学習のプラットフォームとして非常に優れていることを発見した。普段は娯楽目的で利用していたYouTubeが、実はプログラミングやソフトウェア開発に関する、非常に役立つ情報やチュートリアルが豊富に存在する場所であることを認識した。特に、YouTube上には「素晴らしい、役に立ち、非常に励みになるコーディング・ソフトウェア開発コミュニティ」が存在することに感銘を受けている。多くの開発者が自身の知識や経験を共有し、互いに助け合う活発なコミュニティに触れることで、学習意欲が大いに刺激されたようだ。また、YouTubeで数多くのポートフォリオウェブサイトの例を参考にする中で、HTML、CSS、JavaScriptといった基本的な技術だけでも、多種多様なエフェクト(視覚効果)、トランジション(画面切り替え)、ウェブサイトデザインが実現できることに深く感銘を受けたという。この発見は、ウェブ開発の可能性の広さを実感させ、さらなる学習へのモチベーションを高めた。

ソフトウェア開発者見習いプログラムの応募締め切りに間に合わなかったことについても、特に落胆はしておらず、むしろこの経験が、自身のコーディングスキルや今後学習すべきプログラミング言語について、具体的な改善点を見つけるための絶好の機会だったと前向きに捉えている。このプロジェクトを通じて得た知識や経験は、今後の学習やキャリア形成における明確な指針となり、現在は新たなウェブデザインプロジェクトを創造していくことに大きな興奮とインスピレーションを感じている。将来的には、JavaScriptだけでなく、他の様々なプログラミング言語にも完全に習熟することを目指しており、そのための学習を継続していく意向だ。

このウェブサイト制作において、最も困難だったのは技術的な側面ではなく、意外にも「導入ビデオのボイスオーバー(ナレーション)録音」だったと語られている。普段は自分の声に特別な不満はないものの、この録音作業は簡単で楽しいものではなかったと正直に述べている。これは、一つのプロジェクトを完成させるためには、技術開発だけでなく、プレゼンテーションやドキュメンテーションといった付随する様々なタスクにも挑戦が伴うことを示唆している。この経験全体が、開発者としての成長に繋がる貴重な一歩となったことが明らかである。

関連コンテンツ