見出し画像

文系サラリーマンが0知識からWEBページを作成するまでの1ヶ月

昨年末から本格的にプログラミングを勉強し、所属する草野球チーム『福岡ハードバンクポークス』のホームページを2月1日に公開させて頂きました。自分でもまだまだ知識不足で、おそらく見る人が見れば修正が必要な箇所も多々あるのではと思い、震えています。しかし裏を返せばその程度のプログラミング知識でもWEBページ制作は形になると実感しました。学生時代にスポーツしかしていなかった文系サラリーマンの私でもです。
誰でもできると思うからこそ、学習方法やモチベーションの保ち方、苦戦した事を記していきます。プログラミングを始めてみたいけどイメージできないという方の参考になれば嬉しいです!

目標設定

目標設定は重要です。モチベーションや勉強方法、学ぶ言語が変わってくるからです。
人によっては収入を得ることやアプリ開発などを目標に掲げるかもしれません。
私の場合はHTMLとCSSを学習し、『野球チームのホームページ作成』を目標に掲げました。HTML/CSSはプログラミング初心者でもとっつきやすい初歩的な言語です。

学習方法(とりあえずケチってみる)

学習方法にはスクールを受講するか独学がありますが、私は独学を選びました。理由はやはり費用面に尽きます。目標はあくまでも『ホームページ作成』なので、スクールにかけた費用を回収するまでのキャッシュフローがイメージできませんでした。その他に独学のメリットを挙げるなら、自分の好きなペースで進められる事でしょう。
逆にデメリットとしては、行き詰まった時に誰にも質問できないことです。これが想像してた以上に過酷で心が折れかけます。それでいてあまりにもしょーもないスペルミスが原因だったりするので自分がイヤになります。
ただ突破できた時の爽快感はあります。そしてトライ&エラーを繰り返すことで自分が間違えやすい箇所が分かってきますし、調べる力が確実に向上します。

学習環境(憧れの×MacBook)

本格的に学習を開始したのは正月休みに入ったタイミングです。大阪に帰省した1週間で打ち込む事に決めました。
個人的に最も学習に適していた場所は梅田の蔦屋書店です。

そもそもこの空間が好きなのもありましたが、やはり書籍をカフェに持ち込んで参考にしながらコードを書ける点は良かったです。
あと実は蔦屋書店×MacBookの組み合わせを正直ナナメに見ながらも憧れてる自分がいました。
プログラミングにおいてこのようなモチベーションは大事だと思います。

学習コンテンツ(無料で行けるとこまで)

最初は無料でできるとこまでやってみようと思ったので『シラバス』で学習を開始しました。https://cyllabus.jp/

意味はわかっていなくても『シラバス』に従ってコードを書けば、WEBページが作成されていきます。自分が作成している感覚はありません。
ただ色の変え方がわかった時にこの世の色の多さに驚くと共に、全ての色という色を自分が掌握しているかのような錯覚を得ます。

学習を後押ししてくれる出会いもありました。帰省中という事で友人と食事に行った際、たまたま紹介してくれたのが、フリーランスでプログラミングを習得している別の友人でした。そして学習コンテンツとして『Progate』を教えてくれました。この時点では『シラバス』を活用していたので『Progate』を記憶に留めておく程度でしたが、"次会う時に良い報告を"とより一層モチベーションが高まる出会いでした。

すると『シラバス』による学習に限界がきます。テキストに従った学習方法では自分がどこで間違ったかが分からず、エラーを解決できなくなりました。

そこで活躍したのが『Progate』です。https://prog-8.com/

人は出会うべき時に出会うべき人に出会えるようになっているのかもと感じた瞬間です。
『Progate』は有料コンテンツになりますが、e-Learning感覚でかつ自分の間違えたとこもわかるので学習が進みました。
またシラバスを使っていた分、学習効果も高まった気がします。

学習と制作の両立

1月2週目あたりから、Progateによる学習と並行してWEBページ制作を開始しました。制作にあたってはシラバスで使っていたコードを引用しつつ、書籍も参考にしました。

平日は朝の1時間で制作し、夜の1時間はProgateでインプットを進める。
土日は午前中スタバ、午後はコメダかシアトルコーヒー。カフェのハシゴです。この辺りで気づいたのですが、カフェ×MacBookは最高に捗ります。今までナナメに見ていてごめんなさい。

またこの時、妻も試験勉強をしていたので、夫婦で足並みを揃えられたのはタイミングが良かった気がします。何せ土日の計10時間以上を学習に使うのですから。

そんなこんなでProgateによるHTML/CSSの学習が終わった1月中旬以降はWEB制作に専念しました。もちろん分からないところは沢山あるので、その都度検索します。

最後の難関(ドメインとサーバーってなんやねん!)

そして予定通り、1月31日にはWEBページは完成しました。あとはドメインを取得し、サーバーにアップロードするだけ!と思ったのですが、この作業が地獄でした。そもそもドメインもよくわからなければサーバーのしくみもわからない。

ドメインは『.com』とか『.jp』とかのあれです。
『.jp』は信頼度が高いらしく、値段も高めです。
普段.jpだから信頼できるなんて思ったこともないのに。

サーバーはWEBページを他のコンピューターに共有するための"会場"ってとこでしょうか。
自分のPCからこの会場へのアップロードはドラッグ&ドロップ的な事で簡単に入場できると思ったのですが、どうやらFTPというソフトが必要ということが判明。
FTP?もちろん初見です。
ゴールが目前に迫っていながら、次々とどデカい壁が出現し、私の心を折りにきました。

ここの詳細は割愛しますが、ドメインとサーバーを同じサイトで登録した方が楽だった気がします。私はコスパを考慮し、別々にしたのが苦戦を強いられた要因でした。あとファイル名は確実に小文字にしておかないとFTPは融通を効いてくれません。
そしてゴール直前の苦闘の末、ようやくWEBページを公開できました。https://hardbankporks.com/

今まで自分が作ったものを振り返りました。
料理、プレゼン資料、夏休みの自由工作・・・

どれと比較してもダントツの達成感です!

チーム内外への可能性

ホームページを見て、チームに協賛して頂ける方がいればとても嬉しいです。
そしてチーム内でもこの更新作業を回せられたらと思っています。
冒頭に記した通り、謙遜を一切差し引いても自分ができれば誰でもできると思っています。
自分以外のメンバーが更新作業をきっかけにライティングスキルや簡単なプログラミング知識を身につけ、野球以外の部分の可能性を大きく広げるきっかけになれば・・・と送りバント的な想いを持っています。


長くなってしまいましたが、最後まで読んで頂きありがとうございました。
まだまだ分からない事だらけなので、一緒に学習する仲間が増えれば嬉しいです!
そしてこれからも行動を控える"かしこ"であるより、とりあえず行動を起こす"アホ"であろうと思います!


この記事が気に入ったらサポートをしてみませんか?