WEB制作全体としてもそうなんですが、コーディング技術も日進月歩で進化し続けていると思います。そこで、凝り固まった自分のコーディングスキルを見直すために、今の現場レベルの学習をしたい！そう思って、Udemyの評価の高かったWEB講座を購入してみました。
（※購入したのは、2024年の5月です）
今回の記事は、コーディングメインの内容です！
アパレルファッション商品を販売しているオンラインショップを想定したサンプルサイトです。
Udemy講座内容
CodeMafiaさんという現役バリバリのWEBプログラミングされている方の講座です。
これは絶対深く学べそう！と思って購入させていただきました。
- 超初心者さん用のHTML/CSS基礎
- Visual Studio Codeを使用した効率的なコーディング進め方
- CSSアニメーションの効果的な使い方
- JavaScriptの基礎/実践的な記述について
- レスポンシブ対応の方法
- 本格的なWEBコーディングレクチャー
- Netlifyを使用したインターネット公開の方法
上記リストはざっくりとピックアップした内容なんですが、それぞれの各コンテンツがとても充実した内容になっています。トータル時間は、24.5時間もあります。
WEBデザインについて
この記事にアップしているWEBデザインは、この講座で使用されているデザインでは無いです。
僕が別でサンプルで作った全く別のデザインです、あしからず笑
この講座では、今現場で主流となっているコーディングスキルを学びたくて購入しました。
コーディングで勉強になったところ
それでは、コーディングについて。
Visual Studio Codeでのコーディング
僕はエディターについては、Sublimetextを使用してたのですが、Visual Studio Codeの方が現場では主流な印象を持ってたので、この機会に乗り換えたいなということで、この講座を選んだ理由の一つでもあります。
それで、Visual Studio Codeに切り替えたんですが、めちゃくちゃ使いやすいですね！
もう完全にこっちがいいです笑
良かった点を言うと、
- インストールする拡張機能によりますが、コード補完が抜群にサポートされている
- SASSの自動化が簡単すぎる、エンドバーの「Watch Sass」を最初にクリックするだけ
- ファイルを保存するたびに自動でブラウザで表示させている関連ページが更新
- Githubのバージョン管理もVisual Studio Code内で簡単管理、連動してる
いや、Sublimetextでも出来てたことはあって、調べれば全部できると思いますが、なんかそこまで考えることが出来なかった…
というか、もうVisual Studio Codeは、触り心地が良いと言う結論です笑
あ！この講座では、そんなVisual Studio Codeでの効率的なショートカットについて教えてくれています。
CSSとJavaScriptについて
CSSについては、基礎からのセクションもありますが、そこは知識として重複する部分だったので、さらっと見る程度にして、CSSアニメーションの部分をメインに参考にさせていただきました。
- SASSでの記述がベース
- SASSのファイル構成
- @mixinや@extendなどを使用しての効率化
- JavaScriptでのCSSアニメーション制御と管理
もうざっくり言いますと、SASSをメインに進めてくれてたことがとても良かったです。
以前からSASSを使ってたんですが、もう自分は限定的なレベルで視野が狭くなっていましたね…
この講座で知り得たことが大きすぎて。SASS自体もここ数年で進化していました…！
そしてJavaScriptを使って、簡単にCSSアニメーションが制御できる方法もあり、とても目から鱗でした。本当に実務レベルで参考になります！
本格的なWEBコーディングについて
これも今までのWEB制作経験で重複する点はありますが、マークアップの仕方であったり、レスポンシブ対応の考え方が参考になりました。
やっぱり今は、モバイルファーストで考える方が良いと言うことで、モバイルのレイアウトを基準にコーディングして、メディア幅が広がるごとにCSS調整していく方法ですね。
あと、共通クラスを使用して記述を最小限に効率化するレクチャーもあって、なるべく重複させないコーディングの方法。これもとても参考になりました。
Netlifyを使用したインターネット公開
これも目から鱗でした。
Githubの自分のアカウントと連携させて、Netlifyで無料でURLを取得してページを公開することが出来ます。
これは、実務にも超使えるやん！ってなりました…全く無知だったので笑
方法については、ぜひこの講座をご購入されてください。すごく簡単に連携してページ公開できます！
受講後の感想
この講座を受講してもう1年になるんですが、僕は今もこの講座で学んだことをベースにして案件対応しています！
やっぱり定期的にでも学びは必要だなと、改めて感じました。これからも向上心を持って何事も取り組みたいと思います♪
スウィフトデザインでは、WEB制作やロゴデザインもどしどしご相談お待ちしております！
ご質問やDMなどもお気軽にどうぞ〜
