【コーディング課題】XDからコーディングをしよう【初級編】

未経験からWebデザイナーを目指している方向けにコーディング課題を作成したよ!チャレンジしてみてね★

こんな感じのデザインデータを配布してます☆

以下の記事でコーディングの学習ステップを紹介しています!!

【デザインカンプ無料配布】未経験からのコーディング学習ステップ

コーディング課題は初級、中級、上級の3つのレベルを用意しています😊

初級編は特に、HTML/CSSの学習をはじめて、一通り基礎的な知識を学習し終えた方におすすめです。
具体的にはProgateのHTML/CSS、jQueryを学習した方、または、はじめてのコーディングを学習した方を想定しています。

課題のデータのダウンロード

課題のデザインカンプはこちらのリンクからダウンロードしてください。

回答を見ながら学習したい方は、以下の解説記事をご覧ください。

【コーディング~初級編~】解説記事

おすすめの学習方法

コーディングの学習は以下の3セットをおすすめします。

  • 1セット目:解説を見ながら手を動かす。写経のつもりでやる。
  • 2セット目:理解しようとしながらやる。わからない点はメモしておく。
  • 3セット目:2セット目でわからなかったことを復習しながらやる。

1セット目は解説を見ながら写経のようにやるのでもOKです。このとき、理解しようとすらしなくて良いです。頻出のものはだんだんと分かってくるはずなので!

2セット目は理解しようとしながらやってみましょう!わからない点はメモしておいて、後で調べましょう!

3セット目は、2セット目でわからなかった点を理解することを重視してやってみましょう!

この3セットを繰り返せば、ある程度はコーディングが理解できるようになっているはずです😊
地道にがんばりましょうね!!

参考になる記事

XDの導入方法やXDのデザインカンプからコーディングに必要な数値を取得する方法がわからない方は、以下の記事を参考にしてください。

「XDの導入と値の取得方法 〜コーディング課題に取り組む方へ〜」

Googleフォントのインストール方法やコーディングに反映させる方法がわからない方、「そもそもWebフォントって何?」って状態の方は以下の記事を参考にしてください。

「【Webフォントの代表格】Googleフォントの使い方」

毎日学習していてえらいです!!たくさんの方のチャレンジをお待ちしてます!

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA