【このコーディング講座について】

✅累計販売数580部突破！

✅公開4日で販売数179部、レビュー数80件以上！

✅公開2日でBrain総合人気ランキング1位！

✅公開1時間でBrain「プログラミング」ジャンル人気ランキング1位！

どうも、Web制作フリーランスのまさたです。

「基礎文法はそれとなく分かったけど、デザインカンプからのコーディングで手が止まってしまう」

「実装はそれなりに形にできるけど、何となくでコードを書いてしまっているから不安」

「学習期間はある程度長いけど、初期のころとコードを書く速度が変わってない」

「JavaScript（jQuery）の実装がイマイチ理解できていない」

こんなお悩みを一撃で解決するために、

『コーディング学習が1ヶ月〜2ヶ月間で終わる人』を続出させてきた唯一無二の実践型コーディング講座を大公開します。

正直、「Web制作は難しい…。」と思っている人の悩みの9割以上は静的コーディングスキルを磨けば解消します。決して大げさに言っているわけではありません。

学習がいつまでも終わらない人ほど、効率的かつキレイなHTML・CSS・JSのコードの書き方を知らない人が多いし、

「自分はちゃんと実装できているし、今のままで大丈夫だ」と思い込んでます。

でも、ここが落とし穴なんです。

誇張抜きに、静的コーディングスキル（HTML・CSS・JavaScript）の基礎が磨けているだけで、そうでない人と比べて作業速度が2倍は変わります。

普通に独学で勉強している人が学習に6ヶ月以上かけているのを横目に、

僕から、基盤となる静的コーディングスキルを学んでからたった3〜4ヶ月ほどで学習を終わらせて営業活動を始めたのを何度も見てきました。

僕はX（旧Twitter）フォロワーが4700人ほどの1人の発信者としても活動しているので、

あまり進捗が良くない学習者の方から、相談を受けることが多々あります。

でも大半が、

「あ、それ、静的コーディングをちゃんと勉強すればいいですよ」

って結論に至るんですよね。

そして、僕が教えた通りにやってもらったら1ヶ月後に見違えるようにコードがきれいになり、

作業速度も劇的に変わる人が続出しました。

結局は『理論的なコードの書き方』を学んで実践するのが、中長期的に１番楽できるし、安定して稼げている人はコードもきれいな人が多いです。

何となくのコーディングでやっているせいで学習を遠回りしていたり、予期せぬ不具合で1つの実装に何日も溶かしてしまってるんですよね。

そんな思いをするんだったら、最初に正しいコードの書き方を学んで、迷わずスラスラとコードを書けるようになったほうが精神的にも超楽ですよ。

とはいえ、ここまで偉そうに言っている僕も昔はコーディングが全然できませんでした。

↓当時はこんな悲惨な感じでした。

・VSCodeが使えるようになるまでに3日

・初めてのハンバーガーメニューの実装に1週間

・ 2ヶ月間、デザインカンプからのコーディングのことを『模写』と言ってた

・直感で何となくクラス名を決める

・コンソールエラーの解決方法が分からず放置

・どの画面幅でも横スクロールなく実装できたら奇跡

など

1番ヤバかったときでいえば、CSSでの実装が分からないところは全て『position: absolute;』で配置してたときですかね。

今では信じられないですが、それくらいめっちゃめちゃなコードを書いてたんですよね。

でも真剣に正しいコードの書き方を学んだら、まるでパズルを組み立てるかのようにサイトが制作できるようになったんです。

今でも覚えていますが、キレイにコードを書けて自分が思うようにサイトを制作できるようになったときにあまりにも嬉しすぎて、

先輩のフリーランスの方に、

「コード書くのホントに楽しいんですよね！想像したようにサイトが組み立てられるのがたまらないです。」

と、うきうきしながら話したのを今でも覚えています。

そこであなたに1つ質問です。

あなたはどのように作業を進めたいですか？

A：作業時間20時間（そのうち、エラーでつまづいてしんどい時間が5時間、それ以外の時間もずっと頭を悩ませながらコードを書いてる）

B：作業時間15時間（1個や2個は実装で迷うことはあるけど、ググればすぐ解決する、コードは決まった書き方があるのでスラスラ書ける）

もちろん、Bですよね。

これが理論的にコードを学ぶ意味です。

でもぶっちゃけ、理論的なコードの書き方は僕が本講座の中で徹底解説しているので心配はいりません。

僕が一方的に話してもなかなか伝わりづらいと思うので受講生の実績などを紹介しますね。

受講生の実績

口コミ

コーディングスキルを舐めている人多すぎ問題について

ぶっちゃけ、HTML・CSS・JSのいわゆる『静的コーディングスキル』を舐めすぎている人が多すぎます。

↓ちゃんとスキルを磨けば、こんな状態も夢ではないです。

・5,000〜10,000pxほどのサイトなら1日でサクッとコーディングできる

・デザインを見ただけでどうコーディングすべきか想像できる

・パズルのようにサイトを制作できる

本講座でベースのコーディングスキルをつけて、あとはコーディングの量をこなすだけでこんな状態になるのに半年もかかりません。

デザインカンプからのコーディングが上手くいかない人の多くは、何となくコード書いているんですよね。

これが上手くいかない1番の原因です。

まともなコードの書き方を知らないのに、ただひたすらに量をこなしていても、

学習時間だけは長くなるのにコーディングのスキルは一向に上がりません。

そして、その間に正しいコードの書き方を知っているライバルはどんどん実務で案件をこなし始めます。

誰からも学ばずに我流でコーディングをしている状態を言い換えるなら、

ボールの投げ方を教わってないのに野球の試合に出ているようなものです。

そんなのよほどの天才でない限り上手くいくわけがありません。

「コーディングは量をこなすことが大事」とよく言われますが、

これは半分間違いで、

「正しいコーディングの進め方を学んだうえで量をこなす」から上達するのです。

知らない人かなり多いですがベースのコーディングスキルがまともではないと、

・いつまで経っても労働時間が減らずに消耗

・実案件で修正の嵐になって眠れない日々が続く

・毎日お客さんからのクレームの連絡がこないか不安になる

こんな自由とは真逆の生活を送ることになります。

ちゃんとしたスキルを付けていれば、毎回のように継続案件に繋がっていたはずなのに、なぜかいつまでも経っても収入が上がらない。僕はこれまででそういう人を山のように見てきました。

そんな思いを絶対にあなたにはしてほしくないです。

でも、ちゃんとコーディングスキルを磨くだけで、今よりはるかにサイトを作るのが楽になります。

おかげで僕は今こんな感じで今ではコーディングスキルに自信を持って取り組むことができています↓

・デザインカンプを見ただけでどうコーディングしたらいいか瞬時に判断できる

・Web制作会社さんと自信をもって案件をこなすことができる

・Web制作会社さんから「キレイなコードですね！」と何度も褒められる

「案件をこなすためには1年以上学習しないといけないのかな？」

そう思うことも多々あるでしょう。でも僕は実務経験1年未満のときですら、

「本当に実務経験1年未満ですか！？」

と驚かれるくらいのコーディングスキルを身に付けることができていました。それはなぜか？

答えをいってしまうと、

『自分よりスキルのある人のコーディングを徹底的に真似して実践したから』

これに尽きます。

独学ってホントに恐ろしいですよ。

なぜなら自分の知識不足に気づくことができないからです。

特に独学でやるとぐっちゃぐちゃで自分だけしか解読できないようなコードを書きがちです。しかもそれが原因で

・知らぬ間にお客さんに迷惑をかけてしまう

・コーディングに時間がかかりすぎて納期に遅れてしまう

・いつまで経ってもコーディングが上達しない

こんな状態がずっと続きます。はっきり言ってしまうと『稼げない制作者になってしまう』ということです。

もちろんコーディングは慣れで身につくこともありますが、初期段階こそ『知識でカバー』できます。

慣れるまで学習するくらいならササッと実務経験者のコードを見て真似した方がどんどん上達します。

「もっと自分のスキルに自信を持ちたい！」

そう思っているなら、本講座では『5時間を超えるライブコーディング動画』もついているので、そちらを見て僕のコーディングの仕方をそのまま真似して、他の人が独学で遠回りしている内にどんどんスキルアップしていただければと思います。

正直、僕は学習期のときは「あ、多分Web制作の才能ないわ」と何度も思いました。

それでも諦めずに学習を完了させ、数多くの案件をこなしてきたからこそ経済的にも時間的にも自由度の高い生活を実現することができました。

今ではWeb制作をいろんな方に教えたりもしているので、毎日DMが止まらず、

「まさたさん、今ここで詰まってしまっていて教えてもらえないですか？」

こんな内容のメッセージが何度も届いていたりもしていました。それに対して、毎回120%で対応していたので、僕はどこが詰まりやすいポイントなのかが分かるんですよね。

そんな僕が本当に実務で求められることだけを厳選してまとめたものが今回の講座になります。

お客さんからの依頼が止まらなくなるような売れっ子の制作者になりたい方はぜひ本講座で学んでいただければと思います。

本講座の内容

4種類のデザインカンプで実践的に学べる

4種類のデザインカンプの全体はこんな感じです。アニメーションの指示も1つずつ入れています。

※デザインデータは『Figmaカンプ』と『Adobe XDカンプ』の2つをご用意しております。

①小ボリュームのLP（1ページ）

②中ボリュームのLP（1ページ）

③複数ページのサイト（2ページ）

④複数ページのサイト（3ページ）

5時間超えるライブコーディング動画付き

上記の『①小ボリュームのLP（1ページ）』と『②中ボリュームのLP（1ページ）』に関しては僕が1から解説しながらのコーディング動画付きです。ぶっちゃけこれだけでもかなりコーディングスキルを上げることができます。

しかもこれだけで5時間を超える内容なのでかなり学べます。

【ライブコーディング動画のサンプル】

50本以上の動画講義で学べる

ライブコーディング動画と合わせて、『コーディング基礎講座』や『JavaScript（jQuery）講座』の動画講義もご用意しています。なので合計50本以上の動画講義で学ぶことができます。

【コーディング基礎講座】

・よく使うタグについて

・ショートハンドについて

・JSファイルの読み込みについて

・CSSの詳細度について

・CSS設計について

・BEM記法について

・クラス名をつけるときの注意点

・制作着手前チェックについて

・納品前チェックについて

など

【コーディング基礎講座のサンプル】

【JavaScript（jQuery）講座】

・ハンバーガーメニュー

・ドロワーメニュー

・ページ内リンク

・ローディング

・アコーディオン

・ページトップボタン（ページトップに戻るボタン）

・モーダル

・タブ

・スライダー

など

実務で頻繁に出るパーツをおさえた内容になっています。しかも全てサンプルコード付きなのでJavaScriptに苦手意識のある方でも安心してください。

【JavaScript（jQuery）講座のサンプル】

ポートフォリオ（制作実績）として掲載可能

せっかく作ったサイトを、制作実績として使えないともったいないので、本講座のデザインカンプをもとに制作したサイトはポートフォリオとして掲載OKです。特に僕への連絡とかも必要ないのでご安心ください。

※本講座は「Google Chrome」を使用する前提で制作しております。

また、実案件でもGoogle拡張機能の便利な機能を使うことが多いため、ブラウザは「Google Chrome」を使うことを推奨しております

🎁特典について

特典は以下の5個です。

①【学習期から案件受注後もずっと使える】コーディングテンプレートファイル一式

②デキる制作者にぐっと近づくための『全30項目の制作着手前チェックシート』

③誰でも高クオリティのサイトが作れるようになる『全38項目の納品前チェックシート』

④1日で学んですぐに実践できる『個人開発Git講座』

⑤10本の動画で身につける『CSS設計動画講義』

【学習期から案件受注後もずっと使える】コーディングテンプレートファイル一式

本講座の中では、使用するフォルダを解説しているのですがそのフォルダを一から作るのは相当大変です。なので、僕がそのフォルダをそのままお渡しするので、コーディングを学ぶことに集中して学習を進めることができます。

しかも、学習期だけでなく案件を受注できるようになってからもずっと使えるようにしています。

デキる制作者にぐっと近づくための『全30項目の制作着手前チェックシート』

『仕事は準備が8割！』というような言葉あるように、サイト制作でも準備が非常に大事です。

ちゃんと準備をするかどうかで、全然作業効率が違います。

あらかじめデザインカンプで確認すべきことを確認していなくて、知らぬ間に非効率なコーディングをやってしまっているっていうのはあるあるです。本当にもったいないですよね。

ただ、このチェックシートがあると、上から順に確認すべきことをチェックしていくだけで事前準備が完了してしまいます。

誰でも高クオリティのサイトが作れるようになる『全38項目の納品前チェックシート』

もし、今あなたがサイトを制作し終えたあとに

サイト全体をパパっとみて「よし、終わり！」としてしまっているなら要注意です。

それではほとんどのケースで低品質なままで終わってしまっています。しかし、サイトの品質には厳密に確認すべきことがあります。

ただ、1からその項目をまとめるのはとても大変なのでこちらのチェックシートを丸パクリしちゃってOKです。こちらも先ほど紹介した制作着手前チェックシートと同様に、上から順に確認していって不具合が出たら1個ずつ解消していけば誰でも高品質なサイトが出来上がっていきます。

実際に確認してみると分かりますが、かなり改善点が見つかると思います。

1日で学んですぐに実践できる『個人開発Git講座』

「Gitって何？」って方も多いと思うので簡単に説明すると、

『コードを好きなタイミングで保存しておける便利ツール』です。

例えば、ヘッダーを作り終えたときやスライダーを作り終えたときなどにゲームのセーブデータのように要所要所で区切りを付けることができます。

これを一般的には"バージョン管理"と言ったりします。

コーディングしてると実装につまづいて自分でもよく分からないコードを書いて、予期せぬ表示崩れやエラーが起きたりしますよね。でも、Gitで管理しておけば不具合が起きる前のコードに戻すことができるので非常に便利です。

とはいえ、なかなか独学だと理解が難しく挫折しやすい技術だったりするので、僕が1日で習得できるように動画解説しています。

10本の動画で身に付ける『CSS設計動画講義』

『CSS設計』というと堅苦しく感じますが、「キレイなコードを書くための必要知識」のような感覚で思ってもらえればOKです。

ただ、このCSS設計ですがググったり、書籍で学ぶだけだと理解しづらいのが難点なんですよね。

コーディングはスポーツと似ているので実践しながら学ぶことで上手くなります。なのでこの動画講義では、僕が実例を用いて「なぜこのコードを書くのか」に重きを置いて解説しているものや、なかなか理解しづらい概念的な話についても深掘っています。

この動画講義を見れば、どんなコードがキレイなコードなのかが分かるのでその後のコードの質がどんどん高品質になっていくことでしょう。

価格について

定価は『29,800円』になります。

※値下げは早くご購入いただいた方に失礼なので一切行いません。

むしろ今後はコンテンツの追加などにより値上げを検討します。

今回の講座では、1サイト20万円以上で受注できるようなスキルを身につけることができます。そのため、仮にこの講座で学習時間を1ヶ月短縮できたら、その1ヶ月で1サイトを納品してしまうことも全然可能なので、講座費分は余裕で回収できてしまいます。

しかも今だけ僕が2年以上改善し続けて作り上げた『他者よりさらに技術力で差をつけるための豪華5大特典付き』なのでお得に購入されたい方は手にとっていただければと思います。

Q&A

Q　自分にもできるでしょうか？

A　今回の講座はProgateや書籍などでHTML/CSS/Sass/jQueryの基礎文法をおさえていて、今から初めてデザインカンプからのコーディングを行う方に向けて制作していますのでそのレベルに達していれば問題ありません。

Q　この講座を見るだけでコーディングの学習は完了できますか？

A　本講座のサイトを一通り制作できれば、そのままWordPress化の学習に進むことができます。

ライブコーディング動画もあるので、そちらを真似しながらコーディングスキルを磨いていただければと思います。

Q　技術的な質問はしてもいいですか？

A　「講座の通りにやっても上手くいかない」などの不明点があればTwitterや公式LINEにて直接メッセージをいただけばと思います。

Q　こちらの講座ではブラウザは何を使用するべきでしょうか？

A　「Google Chrome」を使用する前提で制作しております。

また、実案件でもGoogle拡張機能の便利な機能を使うことが多いため、ブラウザは「Google Chrome」を使うことを推奨しております。

Q　値下げの予定はありますか？

A　値下げは早くご購入いただいた方に失礼なので一切行いません。むしろ今後、コンテンツの追加にともない値上げをする場合があります。

ぶっちゃけ昔の僕は心の底からコーディングが嫌いでした

今でこそ作業効率が上がって、時給単価でいっても5,000円以上になったりすることもある僕ですが、

昔はめちゃくちゃコーディングが嫌いでした。

丁度2年半ほど前。僕が会社員時代にWeb制作学習に必死こいてやってたときの話です。

改めて言いますが、

↓当時はこんな悲惨な感じでした。

・VSCodeが使えるようになるまでに3日

・初めてのハンバーガーメニューの実装に1週間

・ 2ヶ月間、デザインカンプからのコーディングのことを『模写』と言ってた

・直感で何となくクラス名を決める

・コンソールエラーの解決方法が分からず放置

・どの画面幅でも横スクロールなく実装できたら奇跡

など

1番ヤバかったときでいえば、CSSでの実装が分からないところは全て『position: absolute;』で配置してたときですかね。

結果、実案件のときもめっちゃ苦労して休日は朝から晩までコーディングして時給100円未満とかでした。

当時は2022年までに独立したいと奮闘していたので、「これじゃ、Web制作で独立できないな。」と絶望しました。

まじでしんどかったです。

でも覚悟してWeb制作に取り組んでいたので数万円払って、プロのコーダーにコードの正しい書き方を本気で学びにいきました。

当時会社員だった僕にとってはとてもでかい出費。

とにかく真剣にコードに向き合った。長い期間我流でやってたので、自分のコーディングを矯正するのにものすごく苦労しました。

でも、1ヶ月後、自分のコードが見違えるようにきれいになってたんですよね。

何となくではなく、『なぜこういうコードを書くのか』を人に教えれるレベルになってました。

「早く正しいコードの書き方を学んでれば…。」と後悔した気持ちもあったのですが、

「コーディングが好き。」という感覚を覚えたのはそのころからです。

そして、それから何件も案件をこなしてうちに、すらすらとコーディングできるようになり、実装で迷うことはほとんどなくなりました。

まだ、複雑な要件では実装を悩ませることもあります。でも、昔と違って「できない」わけではなく、「調べればできる」に変わってるんですよね。

今思うとあんなにコーディングが嫌いだった過去の自分が嘘のようです。

僕は「コーディングは別に楽しくなくてもいいですよ」と言うことがあるのですが、

それは「今は楽しくなくても、正しい方向で学び続ければいずれ楽しくなるから」という意味も含んでたりします。

だから今、

「コーディング楽しくないな」

「全然理解できない」

「同じところで数日詰まってしんどい」

こう思っている人も、ちょっとしたきっかけでコーディングが好きになるときがきますよ。

僕の講座がそのきっかけになれば心の底から嬉しいです。

それでは講座に入っていきます。