「東京フリーランス」LP制作② 【30DAYSトライアル5日目】
こんにちは。masaです。
「東京フリーランス」の「Bootstrapの基礎～LP制作編」を現在学んでいます。
しばらくこのブログでも、プログラミング学習の経過報告が中心となります。ご了承ください。
「LP制作」も2本目となりました。学んでいる動画はこちらです。
英語で動画を見続けているため、だんだんと英語の内容が聞き取れるようになりました(笑)
状況↓
まだまだ序盤なので、完成形には程遠いですが、それでもここまでで結構なコードの記述量となっています。これからが楽しみです。
【学んだ点】
・Bootstrap の記法
<button>タグの中の「data-toggle="collapse"」の意味
→ボタンのクリックで折りたたみ可能な要素に指定する（ボタンのクリックで表示、または非表示にする）
→「data-target="#id"」を追加し、ボタンを折りたたみ可能なコンテンツに接続する
この辺はまだよくわかっていません。奥が深いですね、Bootstrap。まだまだ勉強しがいがあります。
ということで、経過報告でした。まだもう少し時間が用いられそうなので、ドットインストールでBootstrapの復習をしつつ、Progate で他の言語を復習しつつで1日を終えたいと思います。
ではまた！
「東京フリーランス」LP制作【30DAYSトライアル4日目】
こんにちは。masaです。
現在、「東京フリーランス」のLP制作に取り組んでいます。
【30DAYSトライアル13～17日目】
完成①↓
完成②↓
完成③↓
完成④↓
【学んだ点】
Bootstrapを用いることによって、スマートなデザインを実現できるとともに、レスポンシブデザインも手軽に指定できることが理解できました。
Bootstrapでは実現できない細かなデザインを、後からCSSを当てて修正していく流れが確認できたため、実際にLP制作の流れが体得できたかもしれません。
ただし、これを自分一人ですべて行うには、かなり時間がかかるだろうし、苦労するはずですので、まずは「自分で」1からLP制作する経験が必要だと感じました。
他にも
- Bootstrapで指定したクラスにも、CSSでデザインを当てることができる
- CSSで「:hover」を「:hovor」としてしまうミスが目立った
-
(HTML) <hf>で水平の罫線を作成できる（horizontal Rule)
という点も学べました。
【補足】動画を見てただコードを写すだけでは実力はつかないので、やはり模写だったりオリジナルのLPを制作する必要がありそうです。
今後はそのための時間も確保し、アウトプットを心掛けようと考えています。
「東京フリーランス」LP制作【30DAYSトライアル3日目】
こんにちは。masaです。
「東京フリーランス」でLP制作に取り組んでいます。
【Day13～17 LP制作】
状況①↓
トップのスライド画像を画面に合わせて大きく表示するためにCSSでデザインを整えました。文字の影のつけ方が理解できたような気がします。
状況②↓
Bootstrapのレスポンシブの設定の仕方を理解。
状況③↓
フッターはこれからCSSでデザインを整えていくのでしょう。どのように行うか、あらかじめ予想しておこうと思います。
そして、いつもプログラミング学習で愛用しているProgateで、Javascriptの新たなレッスン「学習コースⅦ」が追加されたということで、近々勉強したいですね。
どんどんプログラミングの知識を吸収して、いろいろなことにチャレンジしたいと思っています。
今日はここまで！
「東京フリーランス」LP制作【30DAYSトライアル2日目】
【30日 トライアル2日目】
YouTube動画を見ながらLPを制作中です。
LP制作途中の状況①↓
状況②↓
Bootstrapを用いて、スタイリッシュなデザインのサイトや、画面サイズに合わせたレスポンシブデザインを組み込めることを学習。
学習中のYouTube動画はこちらで、
Responsive Bootstrap Website Start To Finish with Bootstrap 4, HTML5 & CSS3 - YouTube
無料にも関わらず非常に内容の濃いレクチャーとなっています。
現在はこの動画の半分のところまで進めることができました。
明日はこの続きへ。
YouTube動画で、LP制作を開始しました【30DAYSトライアル1日目】
こんにちは。masaです。
今回から、筆者が現在行っている「プログラミング学習」を中心とした記事を、日々まとめていきたいと思います。
もちろん、他にも「学校教育」や「感じたこと」など、ネタがあり次第記していきたいと考えていて、要は「ブログ毎日更新」を頑張っていきたいということです(笑)
プログラミング学習の指針となるサイト
さて、今回から次の「東京フリーランス」の「30DAYSトライアル」に沿って、プログラミング学習を進めていきたいと考えています。
https://tokyofreelance.jp/category/daily-trial/
これまで独学でプログラミングを学習してきて、感じていたことがありました。
- 明確な指針と方向性があれば、もっと学習効率が上がる
ということです。プログラミングを勉強している様々な方のツイートを見ていて、最近知った「東京フリーランス」。
学習内容を、どの教材を用いて勉強すればよいか、最終的にどんなところができるようになるかを明確に示しています。この教材に沿って、継続的にトライしたいと思うようになったのです。
Bootstrapの基礎からLP制作へ
30日トライアルの
- Day13～17 BootstrapでビジネスLPを作る
から入りました。以前からBootstrapは勉強していたので、トライアルの中の「ドットインストールでBootstrapを学習する」という項目を飛ばしました。
トライアルで紹介されているYouTube動画を見ながら、コーディングを勉強。英語で解説しているので、時々どんなことを言っているのかわからなくなったりしますが、とりあえず進めています。
現在の制作状況
現在の制作状況。
YouTube動画に必要なテンプレートと画像フォルダのリンクが載せられていて、無料でここまで勉強できるとは、すごい時代に生きていますね。
活用しなければもったいない。
そして、これまで勉強してきたHTML、CSS、Bootstrapを用いてLP制作する過程が楽しくて、毎日コツコツ続けられそうです。
ということで、今回はここまで。「東京フリーランス」はプログラミング初心者の方でも、どのような順番で学習を進めていけばよいか紹介されています。
非常におすすめのサイトですよ。
連休は勉強三昧 サイト模写コーディングに挑戦中【3日経過】
こんにちは。masaです。
学んできたプログラミング言語の実践アウトプットとして、ホームページの模写コーディングに挑戦しています。
【使用言語】
HTML/CSS Bootstrap(CSSフレームワーク)
【模写しているサイト】
Airbnbサイト↓
【制作状況】
1枚目
2枚目
後々可能なら、レンタルサーバーにアップできればと思っています。
【参考にしているブログ】
このブログの内容に沿って、模写コーディングしています。
【模写でこれから行う点】
- ヘッダーの部分の細かい作り（配置がうまく決まらない）
- フッターデザイン（これからコーディング）
- レスポンシブ対応
これまでの学習をアウトプットする意味で、非常に勉強になるのですが、まだまだ素人であると自覚することばかり。
逆に言えば、調べながらでも知識は深まっていく実感があるので、継続して細かいところまで模写していければと思います。
【補足】
Bootstrap の大切なポイントは、グリッドデザインであることがわかるようになりましたが、細かい作り込はCSSで行う必要があるようです。
英語と数学を身に着けると、人生イージー化します【プログラミング学習から】
こんにちは。masaです。
本日は１日の大部分（６時間くらい）をプログラミング学習に充てています。
つくづく思うのですが、１日のなかでできることは本当に少なくて、時間が足りないと感じるくらいです。
お金より時間の方が大切。
フリーランスエンジニアへの道はまだまだ遠いですが、着実に前進していきたいと思っています。
午前中 プログラミング言語「Ruby」を勉強
Rubyとは、簡単に言うと「ウェブサービスのシステムを作る」言語でして、似たようなものに「PHP」という言語があります。
RubyはPHPなどと比べ、「直観的に理解しやすい」点、「記述がシンプル」という点が魅力的な言語です。
それにしても、このProgateで学んでよかったと思う点が、プログラミングの基礎の部分をしっかり理解できることです。
それぞれの言語の特徴と仕組みをスライドで理解しつつ、手を動かしてアウトプットしながら学べるので、復習を合わせて勉強していくとスキルがどんどん向上していきます。
プログラミング初心者には絶対のおすすめ教材です。
午後の一息 ためになった動画
勉強の間に一息、今回はこんな動画を見て、ためになりました。
メンタリストDaiGoの動画は勉強になるものばかりで、彼の影響はかなり受けている一人です。
コーヒーは毎日飲むので見てみたのですが、その他の雑談がかなり面白く、ためになりました。
やはり、世の中の常識にとらわれて生きていてはいけませんね。
午後 JavaScript の実装
午後は動画教材「ドットインストール」を用いて、プログラミング言語「JavaScript」を実際に実装してみました。
Progateで学んだ基礎知識をもとに、パソコンで実装する方法を動画を見ながら行えるので、こちらも非常にためになる教材です。
一つ難点と言えば、プログラミング言語の基礎を理解していないと、どうしてそのような記述をするのか理解が追い付かない部分があります。
そのまま写経していても勉強にはなるのですが、やはり独自で実装するとなると、応用が利かないので、基礎は大事ですね。
今回、JavaScriptを勉強していて気付いた点がありました。
プログラミングを勉強していると、「条件分岐」という記述をする必要が出てくるのですが、
- JavaScript → else if （半角スペースが必要）
- PHP → elseif （スペース不要）
- Ruby → elsif （省略＆スペース不要）
各言語ごとに、微妙な違いなどがあって、今回はそんな点をはっきり理解することができました。
おもしろ動画を見つけた
そして、夕方にかけて一息つく際には、次のような面白い動画を見つけました。
この方の動画はどれを見ても面白いです。
キャラ的に底辺大学生な様相を呈していますが、言っていることはいたって真面目。
再生回数も結構伸びていて、今後注目のYouTuberとなりそうです。
プログラミング学習を通じて実感した「英語」「数学」力の大切さ
そんなこんなで、日々プログラミング学習をしているのですが、気づいたことが一つあります。
- 英語力は社会で生き抜く中で必須のスキル
- 数学力は持っているだけでアドバンテージを築ける大きな武器
プログラミングに限ったことではないと思うのですが、「英語力」は高めれば高めるほど、世の中で生きる上で非常に大きな力となるスキルだと思います。
実際、プログラミングはすべて「英語」で記述されているので、単語の意味を理解していれば容易に学習を進められます。
また、「数学力」も大きな武器になります。問題を解く力というよりは、論理的に考えて試行錯誤する力が大きく役立って、
「数学に強い人は人生イージーモード」と言われるのは、真実のようです。
ブログで「飯を食う」 大半の人が夢見て、あきらめてきた道
こんにちは。masaです。
4月1日は新元号が発表される日とあって、日本中が注目していましたね。
「平成」から「令和」。
正直どうでもいいし、こんなことに注目する意味が分からない。
「元号」が変わることによって、これまでの書類やデータ、その他商品などすべてを入れ替えなければならなくなって、コストがかかり、無駄な時間が生まれるのは確実ですね。
そんな時間と労力があれば、勉強と自己投資をするべきで、常に「世の流れ」に背を向けるべきであると、改めて確信を得た1日でした。
さて、今回は次のようなツイートに注目しました。
なにかに挑戦をすると、必ず失敗します。
— マナブ@バンコク (@manabubannai) 2019年3月31日
例えば、「新しくブログを書く→全く読まれない」とかですね。こういった場合に「自分はダメだ…」と思わず、その結果を冷静に眺めつつ「なぜ読まれないんだろう？」と考えるだけ。そして、次回の記事で改善する。これの繰り返しで、徐々に成果に繋がりますよ
やるべきことは、
— イケハヤ (@IHayato) 2019年4月1日
「今はまだ儲からないとしても、心の底からこれは自分がやるべきだと思える仕事」です。
市場と自分に本気で向き合って
確信できたら、あとは突っ走るのみ。
適宜、方向を転換するのも忘れずに。
今回はこのツイートに注目しつつ、「ブログで飯を食う」ために必要なマインドについてまとめていきたいと思います。
何かに挑戦すると、必ず失敗する
まずは、現在はブログで月収数百万円の収益を得ているマナブさんのツイートから。
「何かに挑戦すると、必ず失敗します。」
現在ブログでかなり稼いでいるマナブさんも、最初の数年は稼げず、苦労していた過去があったようです。
しかし、それでもブログを更新し続け、現在では700日以上ブログを毎日更新するようになって、ここまで来るようになったのです。
- 稼げないから、ブログを辞める。
- 続けられないから、ブログを辞める。
そうではなくて、
- 原因を考えて、次を改善する
- 続けられるように工夫をする
- これを繰り返す
こんな点を学ぶことができました。
今は儲からないとしても、やるべきだと思う仕事をする
次に、こちらもブログで稼いでいるイケハヤさんのツイートです。
やるべきことは、
「今はまだ儲からないとしても、心の底からこれは自分がやるべきだと思える仕事」です。
ブログやアフィリエイトで即利益を残すようになるのは基本的に無理で、
イケハヤさんもブログで稼げるようになるまで数年はかかったそうです。
今ではブログ記事を何千と蓄積されていった結果、収益につながっているので、
- あきらめずに続けること
- 確信したら、突っ走る
この点をイケハヤさんのつぶやきから学びました。
ブログで飯を食うためには
ブログで飯を食う。ほんとにそんなことは可能なのかと現時点では思うのですが、筆者は現在この本を読書しています。
 |
新品価格 |
この本は、勤めていた会社を退職し、妻と子供を抱えながらも、ブログで成功することを夢見て奮闘した筆者の体験から始まります。
ブログで「すぐに」「簡単に」稼げるようにはならないこと、でも「ブログで飯を食う」ために必要なマインドを解説しています。
また、この本も読み、役立ちました。
 |
アフィリエイトで夢を叶えた元OLブロガーが教える 本気で稼げる アフィリエイトブログ 収益・集客が1.5倍UPするプロの技79 新品価格 |
著者は元OLの方で、「ダイエット」記事を中心にブログを執筆。
ブログを読む方の気持ちを考え、悩みを解決することがブログ成功への道であると教えられました。具体的なブログデザインやテーマの決め方など、詳しく書かれた1冊です。
このような本とともに、YouTubeなどでも情報発信している人が多い中、ブログで稼ぐことは決して無理ではないと確信しています。
ですので、筆者も焦らず、コツコツとブログ執筆を続けていくつもりです。
まとめ
今回の記事のまとめです。
- ブログで今すぐ稼ぐようになるのは不可能 長期的には可能
- あきらめずにコツコツと続けることが最短経路
- ブログに確信を持ったら、突っ走るのみ
情報が手に入りやすくなった現代、このようにブログについて発信している方たちに出会ったおかげで、これまで考えたことのなかった世界に足を踏み入れることができています。
いつまでも、古い伝統に縛られた働き方や考え方にとらわれたくないのです。
時間はかかるかもしれませんが、これからも勉強し続けて自らの可能性を高めていきたいと思っています。
人生勉強あるのみ！筆者はそう考えています。
