Web制作勉強方法

実績になる:デザインカンプからのコーディング練習課題【全部盛り】

デザインカンプからのコーディング課題【全部盛り】

今後価格を上げていく可能性があります。

最安値で買えるのは、今だけなのでお早めに!

こんにちは、Web制作コーダー歴7年目のしょーごです。

このページをご覧の方の多くは「コーディングを学習中」だと思います。

ですが、学習中にこんな悩みを持ったことはないでしょうか?

まさひろくん
まさひろくん
コーディングの基礎は学んだけど、実際に戦えるか腕試ししてみたい!!
ありさちゃん
ありさちゃん
実務ではデザインカンプからのコーディングがメインと聞いたけど、その練習がしたいです
ゆうすけくん
ゆうすけくん
実践的で、他の人と被らないポートフォリオを準備したい!!
ようこちゃん
ようこちゃん
現役のエンジニアの方に確認してもらいたい!!

今回ご紹介する「コーディング課題全部盛り」は、この悩みを全て解決します。

ちなみに、この課題を作成している私自身は以下の実績があります。

これまでの実績
  • Web制作会社と6年以上一緒にコーディングしている(最近は新人教育も一部)
  • これまで初学者50人以上の学習&案件獲得をサポート
  • Web制作スクールのメンター数年
  • Webシステムのフロント開発(Rails&Nuxt)
  • 1000人以上の制作物をレビュー

私の場合、ただ単に業界経験があるだけではなく、初学者のフリーランス独立をサポートしてきた経験から、業界で求められている人材も十分に理解しています。

今回紹介する課題は、そこから逆算してつくっているので、クオリティに自身ありです∠(`・ω・´)

また、2023年7月より「オリジナルポートフォリオ化までサポート」する新体制になったので、ポートフォリオが他人と被らなくなりました!!

オリジナルポートフォリオコーディング課題
Web制作 コーディング課題 オリジナルポートフォリオ

更に、2024年から順次デザインを刷新しており、中級・中級Ex・上級課題のデザインは2024年3月より完全に刷新しました。

これにより、一層人と被らないポートフォリオを準備いただけます。

新・上級デザイン
デザインカンプからのコーディング 中級
新・中級デザイン
コーディング課題 中級Ex
新・中級Exデザイン
しょーご

この記事ではしっかり納得した上で買ってほしいので、購入リンクまで記事が非常長いです笑

すぐに購入リンクまで行きたい方は、以下からどうぞ!

\案件獲得に必要な実績スキルが全て手に入る!/

コーディング全部盛りの概要
デザインカンプからのコーディング課題【全部盛り】
  • 全てのコーディング課題が同梱で一番おすすめ
  • 各課題で二回受けられるレビューが無料で付帯
  • 見積もりや納期設定方法などの特典動画をプレゼント!
  • 課題クリア後は実績利用OK!!
  • 実案件でも使えるセルフチェックシートをプレゼント!

\案件に必要な実績スキルが全て手に入る!/

目次
  1. デザインカンプからのコーディング練習課題とは?
  2. コーディング後にオリジナルポートフォリオ化(中級以上一部課題)
  3. デザインカンプからのコーディング課題の中身
  4. デザインカンプからのコーディングができると…?
  5. Web制作コーディング独学のロードマップを参考に
  6. 当サイトからの購入者限定プレゼントあり【動画講義】
  7. 全部盛りに同梱されているコーディング課題の紹介
  8. コーディング課題完走者の口コミ・成果
  9. よくある質問
  10. 価格について
  11. 最後に、購入前のメッセージ(ご購入前にご確認ください)
  12. 相談受け付けます!
  13. 全部盛りの購入はこちらから

デザインカンプからのコーディング練習課題とは?

デザインカンプからのコーディング課題

デザインカンプからのコーディング練習課題は、実案件と同様のプロセスを経て、サイトを完成品として公開するところまで行っていただく、本格的なコーディング実践演習式課題です。

実案件では実装後に担当者のチェックが入るのが基本です。

そこで、この課題では現役エンジニアによる「2回の表示確認特典」をつけています。

コーディング課題

また、この後説明する「オリジナルポートフォリオ化」していただくことで、オリジナル化したものは全課題ポートフォリオ利用可能となります!

コーディング課題で皆様に得てほしいもの
  1. デザインカンプに忠実なコーディングを行えるコーダーとしての力
  2. オリジナル化を行うことにより、質の高いポートフォリオ

基本的に表示確認を受けた上でポートフォリオとして活用いただきます。表示崩れしたポートフォリオはマイナスの印象になるためです。

コーディング後にオリジナルポートフォリオ化(中級以上一部課題)

コーディング課題 オリジナルポートフォリオ

このコーディング課題では、2023年7月より、

デザインカンプからのコーディングのレビューを受けて終了ではなく、その後のオリジナルポートフォリオ化まで原則皆様に行っていただくことになりました!

詳細は以下の記事で解説していますが、これによりポートフォリオとしてより一層輝くと思います。

\案件獲得に必要な実績スキルが全て手に入る!/

オリジナルポートフォリオ化のメリットとは?

オリジナルポートフォリオコーディング課題

オリジナル化とは、具体例をあげると以下のような感じです

オリジナル化のメリット
  • 他人と被りにくいので、ポートフォリオとして活躍しやすい
  • 画像選定やテキスト、ロゴ、配色など、直案件で使うスキルの向上にもなる
  • 従来どおり、まずはデザインカンプからのコーディングを行っていただくので、コーディングスキルの向上も図れる

元々はnoteで出していましたが…

このコーディング課題はこれまでnoteでのみ販売を行っていましたが、今後より一層コンテンツの質に注力していくために、このブログでも販売を開始しました。

まさひろくん

noteのコーディング課題とこのブログのコーディング課題では何が違うの?

という疑問にお答えします。

結論としては、課題の内容はまるっきり一緒です。しかし、このサイトから購入していただいた場合は追加で特典をプレゼントしています!

売り手側の都合ですが、ブログでの購入はnoteに取られる販売手数料がない分、買ってくださった方に還元しやすいです。

しょーご

詳しくはこのあと解説していきます。

\案件獲得に必要な実績スキルが全て手に入る!/

デザインカンプからのコーディング課題の中身

デザインカンプからのコーディング課題では、以下のスライドにあるような課題を作成していきます。

実際にポートフォリオとして活用いただくのは、皆さんのオリジナル化したものになります。

コーディング練習 デザインカンプ
デザインカンプからのコーディング課題
コーディング練習 デザインカンプ
コーディング練習 デザインカンプ
デザインカンプからのコーディング課題
コーディング練習 デザインカンプ
コーディング練習 デザインカンプ
コーディング練習 デザインカンプ
初級編イメージ
初級編その2
初級Exイメージ
中級イメージ
中級編【蓼科ごとう農園】
中級Exイメージ
中級Ex採用サイトイメージ
【2024年改定】上級イメージ
Photoshop編イメージ
previous arrow
next arrow
 

コーディング課題

同梱されている課題の違い

このサイトで販売している商品は大きく3つあります。

  1. 全部盛り→全ての課題を同梱(この課題です)
  2. 中級以上→中級以上の課題を同梱
  3. 即戦力編→中級Ex、上級、Photoshop編を同梱
コーディング課題

実はnoteの方では各課題のバラ売りもしています。しかし、こちらでまとめて購入していただくことで

  • バラ買いよりも大幅に安くなる(最大40%)
  • 限定特典がつく(この後解説)

こういったメリットを提供しています。

しょーご

個人的には、まとめて購入して一気に最後まで完走していただきたい気持ちがあります。

\案件獲得に必要な実績スキルが全て手に入る!/

各課題に2回の表示確認特典付き!!

デザインカンプからのコーディング課題

このコーディング課題最大の特徴と言ってもいいのが「2回受けられる表示確認特典」です。

また、オリジナル化した後も、「一回のみ」無料でレビューを受けることができます。

以下の流れで課題は進んでいきます。

コーディング課題

表示確認は現場で使われているAUNを利用しています。

https://aun.tools/
しょーご

ちなみに、レビュー返しは爆速で行っています。

4月中に(少し過ぎたけど)しょーごさん( @samuraibrass )の中級課題2つとPhotoshopの課題終了。 Photoshopのやつは特にやってよかった。Photoshop実務でいきなり触るの結構きつそう。 あと、しょーごさん毎回返信早くてビックリした。
ハンバーガーメニューに泣いてましたが、今朝、無事しょーごさん中級Ex完成&提出🙆‍♀️  そして2時間後にはレビュー届きました。早い!  今回はリンクなど機能的な部分が抜けてたり。カンプに合わせることに必死で忘れてました😱実案件だと思うと恐ろしい。  今日も隙間時間狙いつつ楽しみます✨
しょーごさん(
@samuraibrass
)の中級課題、さっそくレビュー返ってきました!
やはり早い😳  そしてなんと、1発合格です👏
初級Exに続き、中級も1発合格嬉しい😂  この流れで中級Exも1発合格目指します✊  中級編は基本的なJavaScript盛りだくさんなので力つきますよ!

2回目のレビューも同様に爆速で返しています!

しょーごさん(
@samuraibrass
)の中級課題2回目の添削も返ってくるの爆速😂
凡ミスだよなぁ🤔勿体ない💦
合格!とはなれなくて残念だけどしっかり振り返ってポートフォリオに使わせていただきます!
EXこそは合格いただくために頑張る!!
いつもありがとうございます!

サイトの公開方法について

サイトを公開したことが無い方が多いかもしれませんが、課題の中でかなり優しく解説していますので、大丈夫です。

画像40枚で優しく解説しています

基本的にはレンタルサーバー上でBasic認証をかけた上で、課題をアップロードしていただきます。

実務でも使えるセルフチェックシートプレゼント!!

コーディング課題

各教材ごとにチェック項目を指定しているので、セルフチェックの手法を学ぶことができます。

セルフチェック→表示確認の二段構えでクオリティの高いポートフォリオを準備することが可能になります。

\案件獲得に必要な実績スキルが全て手に入る!/

デザインカンプからのコーディングができると…?

web制作 デザインカンプからのコーディング課題

この課題の中の

  • 中級Ex
  • 上級
  • Photoshop編

これらをクリアできれば、スキル的には月20万を稼げるスキルです。

WordPressコーポレートサイト10p程度コーディングを20万程度で、一ヶ月かけて構築するみたいな案件はこなせるレベルになれます。

Web制作コーディング独学のロードマップを参考に

各課題のレベルと、どのタイミングでやれば良いかが分かる

コーディング課題

しょーごログでは「Web制作独学ロードマップ」を無料公開しています。

各コーディング課題はロードマップと照らし合わせて利用していただければ、

まさひろくん

自分はこのレベルだから、この課題に取り組もう!!

というのが分かりやすくなります。

当サイトからの購入者限定プレゼントあり【動画講義】

デザインカンプからのコーディング課題

第一弾:実案件の”上手い”納期設定の方法を解説!

各コーディング課題には目標納期を一応設定しています。

これは実案件より少しゆるくした納期設定となっていますが、実際の案件ではどのように納期を設定すれば良いのでしょうか?

具体例を元に限定動画で解説しています。

限定動画より抜粋

第二弾:制作会社はポートフォリオのどこを見ているのか?

制作会社は送られてきたポートフォリオの表示だけを見ているわけではありません。

あなたのコードの〇〇な部分も実は見ています!

特によく見られる部分4選をブログ版限定コンテンツでは解説しています。

\案件獲得に必要な実績スキルが全て手に入る!/

全部盛りに同梱されているコーディング課題の紹介

初級編【HTML.CSSの超基礎を固める】

コーディング課題

初級編ではHTML,CSSの超基本である「要素の中央揃え」「横並び」などを復習するようなコンテンツにしています。

コーディング課題

これが難しいと感じる方向けに、完全無料でより簡単な入門編も同梱しています。また初級編には「模範解答」が存在しますので、ご安心ください。

初級編以外では、模範解答の変わりに過去の完走者の実装例一部解説動画でサポートしています。

この課題でできるようになること

デザインカンプからの基本的なコーディング方法が分かる

初級その2【初級Exまでの橋渡し】

コーディング初級その2課題

初級その2ではHTML,CSSのレスポンシブに慣れていただきます。スマホのファーストビューのデザインカンプも添付しています。

制作するのは「ホームページ制作会社のトップページ」になります。

Figmaデザインカンプからのコーディング方法【とても簡単】

初級その2には模範解答をつけていますので、ご安心ください。

初級編、初級その2以外では、模範解答の変わりに過去の完走者の実装例一部解説動画でサポートしています。

この課題でできるようになること

デザインカンプのレスポンシブに慣れることができる

初級Ex編【HTML.CSSの基礎完成】

コーディング課題

初級Exは「架空の内科医院」を想定して、HTML,CSSの総復習を行う課題になります。

ここから難易度が大きく上がるように感じる方が多いようです(;・∀・)

コーディング課題

この課題の特徴として、

  • HTML.CSSのみでコーディングできるが、少し難し目のレイアウト
  • ポートフォリオとして出せるレベル感、デザイン

こういったものを目指してデザインを作成しました。

コーディング課題

デザインカンプはPCサイズのものだけになるので、レスポンシブの仕方などは動画解説などを参考にしてください。

表示確認例

初級Exから「2回の表示確認特典」があります。以下はフィードバック例です。

コーディング課題
コーディング課題
この課題でできるようになること

HTML.CSSコーディングで基本的なレイアウトが再現できるようになる

\案件獲得に必要な実績スキルが全て手に入る!/

中級編【JS導入】

デザインカンプからのコーディング課題 中級

中級編は2つの課題から一つを選択していただきます。

デザインカンプからのコーディング課題
  • 架空農園サイト
  • 架空サービスサイト(おすすめ)

両方の課題をコーディングしていただくことも可能ですが、無料レビューは一つのみで、二作品目レビューは有償で賜っています。

この課題の特徴として「jQuery」「JavaScript」を導入して進めていくことになります。

・JSを利用したハンバーガーメニュー、アコーディオン、スライダー(Swiper)の作成
・Googleフォームを用いて静的サイトのフォームを実際に動作させる(参考記事執筆済み)
・JavaScriptまたはjQueryでのフォームの入力確認

デザインは以下の感じです。

デザインカンプからのコーディング課題
農園サイト(オリジナル化の必要あり)
デザインカンプからのコーディング 中級
オリジナル化の必要なし

表示確認例

コーディング課題
この課題でできるようになること

HTML.CSSに加え、JSを利用した動きのあるページがコーディングできるようになる

中級Ex編【難しいレイアウトとアニメーション】

コーディング課題 中級Ex

中級Ex編も2つの課題から一つを選択していただきます。

コーディング課題 中級Ex
  1. 新卒採用サイト
  2. 建築会社サイト(おすすめ)

この課題からまた難易度がぐっと上がります(;・∀・)

この課題は「複数ページ」で構成されています

コーディング課題 中級Ex
コーディング課題 中級Ex
建築会社サイトの場合

実際の案件では複数ページをコーディングすることがほとんどなので、本課題では下層ページを数枚つけました。

その他の特徴も合わせて一覧で書き出します。

  • 複数ページで構成
  • CSSアニメーションでの画像切替
  • JavaScriptでモーダルやタブ、header制御
  • JavaScriptのライブラリ使用(カレンダー)
  • 頻出の和風レイアウト(縦書きCSS、ブロークングリッドなど)
  • パンくずの構造化マークアップ

仕様が非常に実案件に近いので、こちらの課題を完走された方は、

問題なくHTML,CSS,JSの案件に望める

と思ってもらって大丈夫です👍

中級Ex以降は実績として強い

中級Ex以降はデザイン性も高いので、営業や就職・転職の際にコーディングスキルの大きなアピールになります。

ぜひみなさんにはこの先のPhotoshop編まで到達してほしいと思っています。

表示確認例

コーディング課題
この課題でできるようになること

実案件レベルのHTML,CSS,JSの実装ができるようになる

上級編【WordPress実務レベルへ】

コーディング課題 上級

上級編はITコンサルティングファームTETOTEの採用サイトを、WordPressで制作していきます。

デザインカンプからのコーディング課題 上級

今回は全部で12ページあります。

デザインカンプからのコーディング課題 上級

ページの構成としては以下の感じで、実案件でよくある基本的なコーポレートサイトの要素を備えています↓

デザインカンプからのコーディング課題 上級

上級課題の特徴

  1. サイトの複数ページの構築方法が分かる→実案件の大半は複数ページのWordPressサイト
  2. WordPressサイトの構築を、プラグイン含め一通り学べる
  3. カスタム投稿とカスタムフィールドの実務レベルの力がつく

いくつか肝となるポイントを解説すると、例えば以下はカスタム投稿「スタッフ管理」を準備してもらい、それを用いてスライダー形式でループを回しつつ、

各スタッフに紐づいている「名前、役職、入社年度」などのカスタムフィールドも表示させています。

デザインカンプからのコーディング課題上級

こういった実務レベルの実装に挑戦することができます。

納期チャレンジ開催中!!

上級課題は、実案件レベルのスピード感を体感して欲しいので、

  • 24日以内に初稿(一回目レビュー)を提出して
  • かつ修正点が10個以内

これを基準に定めています。つまり「スピーディーに・綺麗に」コーディングする必要があります。

コーディング開始前に、専用の宣言フォームからスタート宣言していただきます。

これによって、実務レベルのスピード感を体感することが可能です。

合格・不合格で具体的に何かがあるわけではありません。あくまでチャレンジで、ご自身の現在地を確認していただくシステムなので、不合格でもポートフォリオとして利用できますので、ご安心ください。

表示確認例

上級はページ数が多いのでかなりチェックが大変ですが、頑張ります(;・∀・)

コーディング課題
この課題でできるようになること

多くの案件である「WordPress製コーポレートサイト」の実装ができるようになる

\案件獲得に必要な実績スキルが全て手に入る!/

Photoshop編【一番多いPhotoshopに慣れる】

コーディング課題

Photoshop編は、その名の通りPhotoshopデザインカンプから「製造業・土木系サイト」をコーディングしていただきます。

WordPress化はなくトップページのみですが、デザインの難易度は最難関です。

Photoshop編はヒント動画は用意していません、実際のコーディング案件を想定したデザインとレベルなので、完全に自分一人の力で実装してみてください。

なぜPhotoshopなのか?

このデザインカンプだけPhotoshopで作られていますが、これは意図的にそうしています。

実案件ではまだまだFigmaやXDではなく、Photoshopでデザインカンプが来ることが多いです。

しかし、Photoshopはいまいち直感的でないので、FigmaやXDに慣れていると、初見のときにコーディングする際にパニックになります(;・∀・)

そこで、この課題で練習できるようにしておきました。

注意点:Photoshopが必要です

AdobeのPhotoshopが必要になります。

最安で手に入れる方法は別途解説しているので、そちらから準備いただきます。

しょーご

実務でも多くの場合使うことになりますからね。

特にポートフォリオとして大活躍します

このデザインはあらかたコーディング経験のある方で、しかもPhotoshopが必要だったり、取り組み自体のハードルがかなり高いので、

営業先でポートフォリオが被ることはまず無いのではと思ってます笑

また、「中級Ex」「上級」「Photoshop編」の3つで「三種の神器」と勝手に呼んでいます笑

実際この3つはかなりポートフォリオとして効いてくると思います。

ぜひ完走してほしいです。

コーディング課題

今回は、普段から制作会社とPhotoshopメインでお仕事をされているWebデザイナーの方にデザイン作成をお願いしました。

また、今回は「スマホカンプ」を用意しておりますので、「スマホサイズもスマホカンプ通りにコーディング」する経験を積んでいただけます。

コーディング課題
コーディング課題
スマホデザインの一部
この課題でできるようになること

Photoshopデザインから複雑な実装ができるようになる

4月中に(少し過ぎたけど)しょーごさん( @samuraibrass )の中級課題2つとPhotoshopの課題終了。 Photoshopのやつは特にやってよかった。Photoshop実務でいきなり触るの結構きつそう。 あと、しょーごさん毎回返信早くてビックリした。
Photoshopは初見だときついので、ぜひ挑戦してほしいです。

\案件獲得に必要な実績スキルが全て手に入る!/

【JavaScript,jQuery特訓編】web制作でよくあるパーツを実装しよう【解答付き】

コーディング課題

web制作に特化したjQuery,JavaScript教材」になります。

学べること

・web制作で頻出のjQuery、JavaScriptによるDOM操作実践
・jQuery,JavaScriptの書き方の違い
・デバッグ方法、開発の進め方

コーディング課題
作るもの7つ

・ハンバーガーメニュー
・ドロワーメニュー
・ローディング
・スムーススクロールでページトップに戻るのボタン
・アコーディオン
・モーダル
・タブ

web制作のjQuery,JavaScript学習における課題

今回の教材作成はとある問題意識からスタートしています。
それは「web制作に特化したJS教材がない」ということです。

特に「実際にものを作りながら学べる教材が少ない」と感じていました。

そこで、この教材はweb制作でよくあるパーツを実装しながら、jQuery,JavaScript両方学べる教材にしました。

web制作で頻出のパーツなので、今回の教材でのコードは実案件で即使うことができます。

特に、「ハンバーガーメニュー」「ドロワーメニュー」などは実案件での使用率は70%超えぐらいで頻繁に使うので、今回作ったものは確実に資産になります(もちろん解答コードを実案件でそのまま流用いただいても構いません

\案件獲得に必要な実績スキルが全て手に入る!/

コーディング課題完走者の口コミ・成果

評判・口コミ
しょーご

こちらではこれまでコーディング課題を完走した人の口コミを掲載しています。

クライアントからクオリティを褒められる!!

コーディング課題→クラウドソーシングで案件受注→納品

営業と就活を初めて15日目 0→1 達成しました! クラウドソーシングにて受注し納品、評価完了です😆 しょーごさん( @samuraibrass )の三種の神器のおかげです。 自身契約のサーバーにテスト公開し、デイリー進捗報告。この流れも経験済みで助かりました! 感謝です😊
三種の神器とは、「中級Ex」「上級」「Photoshop編」を指します
営業6日間の成績は25件応募、5件返信、1件受注(継続案件)、2件相談中、1件スカウト ソーシングサイトの受注評価0で未経験でも受注はできる! 勉強→デイトラ ポートフォリオ→しょーごさん @samuraibrass #note https://note.com/samuraibrass/m/mad296098d928 #web制作 #駆け出しエンジニアと繋がりたい

学習開始3ヶ月でPhotoshop編まで完走!!

しょーごログ

銀行員→フルリモートの正社員コーダー

しょーごさん @samuraibrass のロードマップを見てweb制作を始めて1年。1ヶ月サボったりしたけど、新卒で入った銀行を辞めてフルリモートのコーダーとして転職できました。フリーランスの道は一回閉ざしたけど、フリーランスを目指してやってなかったらこの結果すら出てなかった。 #web制作

コーディング課題→Web制作会社と提携

制作会社の社員さんも活用!!

コーディング練習教材

2024年に頂いたメッセージ

ここからは頂いた最新のメッセージを掲載しています。

shogo様  こちらのアドレスに返信していいのか分からなかったのですが、一言お礼だけ伝えたくて。ダメだったらすみません💦  レビューありがとうございました!
初めてのことが多く、OKをいただけたのが本当に嬉しいです。お忙しい中とても細かく見ていただいて驚きました。教材購入して本当に良かったです。

よくある質問

FAQ よくある質問

表示確認2回でクリアできなくてもポートフォリオとして活用可能でしょうか?

可能です。その場合はセルフチェックで各自の判断で公開お願いします。
*表示確認は初級Ex以降の特典です

表示確認はどれぐらいの期間で返ってくるのでしょうか?

通常3日以内です。それ以上経っても返信のない場合はメールが届いていない可能性があるので再送いただければと思います。

模範回答はありますか?

模範回答はありませんが、完走者の実装例を複数掲載しているので、参考にしていただくことが可能です。また、難関ポイントは動画解説を加えています。

技術的にわからない部分を質問できますか?

質問はお受けしておりませんm(_ _)m
その代わり完走された方のサイトを掲載しております(初級Exより)。また解説動画を用意しており、今後より一層挫折を防ぐ仕組みづくりを構築していきます。

これら一連の教材で案件獲得できるレベルになりますか?

本教材は私が公開しているロードマップに練り込んでいるため、ロードマップ上で活用していただけると各教材がどのレベル感になるのか、イメージが湧きやすいかと思います。

各課題の単体販売はしていないのですか?

noteでは販売していますが、こちらのサイトでは単体販売の予定はありません。また、こちらのサイトで購入頂いた場合は限定特典をプレゼント予定です。

すでにnoteで課題を購入している者ですが、noteの方も今後更新されますか?

noteも動画解説など同様に更新していきます!違いは「限定コンテンツの有無のみ」です。

レビューを受けていない課題をポートフォリオ利用してもいいですか?

ポートフォリオ利用される際は基本的にレビューを受けたものにしてほしいですが、強制はしていないです。ですがmレビューを受けることで自信を持ってポートフォリオアピールできるかと思います。

オリジナル化できる自信が無いんですが…

オリジナル化する方法を解説した記事を紹介しています。正直簡単ではありませんが、その分三者三様のポートフォリオが出てきて被りにくいとも言えます。頑張りましょう!

XDはソフトが必要ですか?

XDデザインはFigmaのようにブラウザで動くURLカンプで配布しているので、ソフトいらずです。

\案件獲得に必要な実績スキルが全て手に入る!/

価格について

この全部盛りセットは¥19,800(税込み)で販売しています。

この一連のコーディング課題の、例えば中級がもしコーディング実案件であれば¥20,000~¥30,000で受注でき、すぐにコスト回収ができます。

上級のWordPressまでいけば、一発で¥200,000も硬いです。

つまりこの一連のコーディング課題をクリアすることで「月収20万を稼げるスキル」は確実に身につきます。

正直

  • 各課題毎にレビューを「最大3回」まで無料で受けられる
  • ポートフォリオをオリジナル化して、レビューまで受けられる

という特典があって、この金額は破格すぎるのですが、学習中の方はお金の無い方も多いだろうと思い、この価格で頑張って販売しています。

自分の時給より、取り組む方の未来を応援したい。

しょーごログさんから、WEB制作演習課題全部盛りを購入しました。
この内容、ボリューム、レビューがついてこのお値段⁉️
お得感満載です。
力をつけて近いうちに中級最終課題に戻ってこれるように頑張ります。
しょーご

全ては「自分が駆け出しのときに欲しかったもの」を「今必要な人に」という思いで、サービス運営しています。

\案件獲得に必要な実績スキルが全て手に入る!/

最後に、購入前のメッセージ(ご購入前にご確認ください)

ご購入頂く前に、注意点をいくつか書きます。

デザインカンプからのコーディングそのままをポートフォリオにはできません【一部デザインのみ】

このコーディング課題では、一部デザインは「オリジナル化したものをポートフォリオとして活用」していただきます。

コーディング課題 オリジナルポートフォリオ
コーディング課題で皆様に得てほしいもの
  1. デザインカンプに忠実なコーディングを行えるコーダーとしての力
  2. オリジナル化を行うことにより、質の高いポートフォリオ
まさひろくん

僕デザインセンス無いけど、大丈夫かな…?

しょーご

特別解説記事を用意しています!また、オリジナル化事例集もたくさん用意していますので、思ったより簡単ですよ!☺️

しょーご

まあ基本的には新しい方の、オリジナル化の必要無いデザインを選択してもらえればいいかなと思います。

実務志向なので、少し厳しい課題になります

このコーディング課題群は「実案件レベルまで鍛え上げる」ことを目的に作成しているので、最初はかなりきついと思います。

課題の一回目提出前のセルフチェックも、チェック項目や頻出のミスポイント情報を提供した上で、徹底して行ってもらいます。

しょーご

実務では先方に実装を確認して貰う前に、こちらでセルフチェックを行うのが基本になります。

イメージしにくいかもしれませんが大丈夫。失敗可能なここで練習しておきましょう!!

質問対応には未対応ですが…

デザインカンプからのコーディング課題

申し訳ありません。このサービスは表示確認含めて外注せず完全に私一人で運営しており、

質問対応まで行うと私のキャパシティオーバーになってしまうので、質問対応は行っておりませんm(_ _)m

それゆえこの価格で提供できています。その代わりに、難関箇所のライブコーディングの解説動画を用意しておりますので、

これによって、皆さんの学習をサポートしていきます。

どうしても分からなくても、動画と一緒に手を動かして貰えれば、一旦は突破できるようにしました!

コーディング課題 初級Ex
初級Exのレスポンシブ動画解説
中級Exの動画解説の一コマ
しょーご

解説動画は随時増やしていきます!

頑張る意志の強い、あなたを応援したい

画像に alt 属性が指定されていません。ファイル名: AdobeStock_269325622.jpeg

ここまで読んで検討してくださるあなたは、きっと頑張る意志の強い人なのでしょう。

このコーディング課題は確かに手強く、実際楽ではありません。

しかし、その分コーディング力がみるみるうちに上がっていくのを確実に感じられます。

実案件レベルの厳しいレビューを是非体感して頂き、案件前の最後の挑戦にして、自信をつけていただければと思います。

しょーご

あなたの課題の提出を楽しみにしております!!

相談受け付けます!

もしまだ自分に必要かわからない方がいらっしゃれば、LINEでも無料相談に乗ります!

お互い不幸になるため、押し売りしません。
あなたに本当に必要か客観的に見てアドバイスをさせていただきます!
また、Web制作学習に関するアドバイスも可能なので、お気軽にご連絡ください!

LINEで相談してみる

全部盛りの購入はこちらから

コーディング課題全部盛り

コーディング課題全部盛りは、以下のボタンよりご購入ください!

\今日から始められます!!/

決済にはStripeを使用しています。

ボタンを押すと、Stripeでの支払いページに遷移するので、支払い情報を入力お願いします。

支払う」を押すと、サンクスページにリダイレクトします。

その後自動返信メールで課題ページのURLとパスワードが来ますので、学習を始めてください。

メールは全部盛りの例です。

たまにURLが開けないことがありますが、原因は「サイトURLとパスワードが一緒にクリックされているから」になります。

これは特定のメールソフトによるもので、サイトURL以外の部分もURLとみなされることがあるようです。
サイトURLのみを開くようにすれば開けますので、宜しくお願いします。

しょーご

皆さんのレビュー依頼をお待ちしています!!