ホームページを作ってみようと思う。
課題
写真の大きさの変換ができない。
ヘッダーのリストが左に表示されない。
1日目:ルール決め_2023年11月4日
ふと思いついて検索してみたらほしいデータのホームページは見つからなかったので、あるデータを入れたら、データの中からその数字に見合う数値や文字を返してくれるホームページを作ろうと思う。入力するあるデータは秘密。プログラムは未経験。知識はprogateっていうプログラミング勉強サイトから学ぶつもり。とりあえず知り合いの詳しい人にファイルをサーバーにあげればホームページはできると言われた。ここにはその軌跡を残したいと思う。これまでPythonとHTMLを少しやったけど、どっちかやるとどっちか忘れるからほぼ忘れてる。
ルール
その日やることを書き終えたら、大見出しで
◯日目:次の日にやる目標
あとは頑張りすぎない。1日1時間程度にする。
2023年11月4日追加:ルールは変更、追加の可能性あり。その都度日付を入れる。
2024年5月17日追加:HPの完成目標は10月末日
2日目:無料サーバーを探す_2023年11月5日
まずは、「無料 サーバー」で検索。いくつかのスポンサーサイトをクリックして、無料じゃないじゃんとか思いながら行き着いたのが、初期費用も年会費もなく、広告もない。なによりホームページ作りたい人向けって書いてあるw他のところはサーバー運用したい人とか、上級者向けとかって書いてあるので、厳しいかなと思った。
ニックネームなんかを設定して登録。その後フリープラン新規でつくった。表示されるまで1時間くらいかかるみたいなので、今日はここで終了。
3日目:トップページを作る_2023年11月6日
トップページ作ろうと思ったけど、まずどうやってindex.htmlをmacでつくるのかわからない。FTPソフトというのをダウンロードした。Progateでは文字の色や大きさを変更する方法を学んだ。index.htmlを作れるまではProgateだけをする予定。
4日目:トップページイメージ作成_2023年11月7日
トップページを作るツール(ビジュアルスタジオコード)がわかったので、作成してあげた。トップページに画像を上げておきたいのだが、画像のリンクを貼っても画像が上がらない。引き続きトップページの作成を行う予定。
5日目:ホームページの名前決め_2023年11月8日
ホームページのタブに表示される名前を決めようと思う。ツイッターの名前、ラジオネーム、外国語といろいろ考えたけど、結局自分でほしいものをつくるので、「あるといいな」にした。アップ済み。キャッシュクリアで画像の表示ができたため、明日はトップページの画像の大きさや文字の配置を変更予定。
6日目:トップページの調整_2023年11月9日
とりあえずトップページは完了。次はProgateのとおりにメインとお問合せフォームをつくる。メインは現状は構想がないのでこのままで主にお問合せフォームをつくる。
7日目:お問合せフォーム作成_2023年11月10日
お問合せフォーム(仮)をつくった。まだ送信しても届かない。同じ書式をCSSで設定する時の,は便利。色の配分が難しい。いい感じの色の配置はセンスなんだろうなー。そしてCSSファイルもアップロードしたのに、HPにはなぜか書式とかが反映されない。
8日目:画像を半透明にする_2023年11月13日
画像を半透明にはできなかったけど、画像を背景にすることができた。
ヘッダーを右にロゴ、左にリストを入れるとその間にmainが入ってきてまるで本文真ん中から始まる。その左にヘッダーロゴ、右に文言みたいな変なページだったが、Progateのものと比較してもわからなかったし、Progateのほうが、新しい概念top-wrapperを入れてきたので、この機会に打ち直すことを決意し、全部一度やり直した。そうしたら解決したけど、今持って何が悪かったのかわからない。そしてなぜか作り忘れてたお問合せフォームの送信ボタンを作った。次は入力方法の選択欄をボタンにしようと思う。
9日目:ボタンを作ろう_2023年11月14日
入力用のボタンを作った。ツイッターとかへのリンクのボタンとかも作ろうと思ったけど、今は不要かなと思って作ってない。
10日目:ヘッダーのレイアウトを整える1_2023年11月15日
ヘッダーレイアウトを整えた。ヘッダー文字の高さなどはまだ整えてない。
11日目:ヘッダーレイアウトを整える2_2023年11月16日
とりあえずヘッダーは完了。特に変更せずProgateだけやった感じ。明日もProgateを進めることにする。
12日目:メイン部分のレイアウト調整_2023年11月20日
メイン部のレイアウトを調整した。入力ボタンを画像で囲みたくてアンティグアとバールベックとパルミラの写真をアップしたけど、画像のサイズ変換ができない。画像のサイズ変換を検索して探したけど、できなかった。このnoteのページが開くようなリンクをつけた。このnoteの上部に今現在できない課題を記入する欄を設けた。
13日目:メッセージ部分の作成_2023年11月21日
Progateでメッセージ部分をやった。
14日目:フッター作成_2023年11月24日
Progateでフッターを作成した。HPのリンクをタイトルに付けた。
15日目:ヘッダーの固定_2023年11月27日
ヘッダーの固定はできたが、ヘッダーリストが左にいかなくなってしまった。課題はあるけど、次にすすむことにした。
16日目:JavaScript入門_2023年11月28日
JavaScriptの入門として変数、定数をやった。せみころんがうざいw
17日目:JavaScript入門2_2023年12月1日
JavaScript入門としてif式からelseの利用方法までやった。これをやっていけば将来的に数値を入力して、正ならこっちとかに分岐できる。ただ、これを今の処理で行うとめちゃめちゃ大変そうなので、続きを期待。
18日目:JavaScript入門3_2024年4月17日
かれこれ半年近く間があいてしまったので、今日はならし。JavaScriptを最初からやることにした。明日は計算に入る予定。
19日目:JavaScript入門_2024年4月18日
JavaScriptを少しやった。作りたいHPの中身をグーグルスプレッドシートに記載した。https://docs.google.com/spreadsheets/d/1EmcNlkI9_iYxiOrgiiq0qY3UiOdtnXrHXUaJsqYSvUc/edit#gid=0
20日目:JavaScript入門_2024年4月19日
関数の定義までやった。
21日目:JavaScript入門_2024年4月22日
変数と定数の定義と出力までやった。
22日目:JavaScript入門_2024年4月30日
ジャバスクリプトのif文の書き方までやった。
23日目:JavaScript入門_2024年5月1日
JavaScript等価演算子をやった。厳密等価演算子との違いが面白かった。
24日目:JavaScript入門_2024年5月13日
JavaScriptのかつ、またはの記号をやった。
25日目:JavaScript2_2024年5月14日
JavaScriptの2に入った。関数の定義の仕方を忘れていた。
26日目:JavaScript2_2024年5月17日
JavaScriptのwhile,forの構文をやった。3の倍数という数式が出来なかった。
HPを10月末くらいまでには完成させたいと思った。
27日目:JavaScript2_2024年5月20日
グループ化とfor文やった。,と;の勘違いが多い。
28日目:JavaScript3_2024年5月21日
JavaScript3に入った。関数の戻り値手前までやった。
29日目:JavaScript3_2024年5月22日
明日は総合問題。そろそろ数値の入力のことをしたい。
30日目:JavaScript4_2024年5月27日
コールバック関数に入った。
31日目:JavaScript4_2024年5月28日
フィルター関数をした。コールバック関数が難しい。
32日目:JavaScript4_2024年6月10日
JavaScript終了。つぎはサーバーについてのプログラムをやるみたい。
33日目:node.js_2024年6月11日
node.jsの説明に入った。サーバーサイドの言語ということ。これまでのHTML、CSS、JavaScriptはブラウザ側の言語ということだった。
34日目:node.js_2024年6月13日
プログラムを書く画面が複数になり、一気に難しくなった。
35日目:node.js_2024年6月14日
ejsに入った。難しい。
36日目:ejs_2024年_6月17日
ひたすら難しい。HTMLの中にJavaScriptをかけるのがそんなに便利なのかわからない。ってとこで今日は疲れたので明日に。