書いたコードがデザインに変わる!フロントエンド開発の魅力

HaRuSennSei

画面の変化がすぐにわかるから楽しい!自分のアイデアをWeb上に表現してみませんか?

プログラミングの分野の中でも、フロントエンド開発(HTML/CSS/Bootstrap)は「自分の書いたコードが、瞬時に画面上のデザインとして反映される」という特長があります。文字の色が変わったり、レイアウトが綺麗に整ったりするのをその場で確認できるため、パズルを解くような楽しさと、モノづくりの達成感を同時に味わうことができます。

ただ論理を学ぶだけでなく、クリエイティブな表現に興味がある方にもぴったりです。現場で使われる「Visual Studio Code」を使いながら、あなたの頭の中にあるアイデアを具体的な形にするお手伝いをします。

一緒に自分だけのオリジナル作品を作り上げましょう!


【レッスンに関する情報】

タイトル:
25分×4回パック|初心者歓迎!フロントエンド開発(HTML/CSS/Bootstrap)入門
(1回のみの体験レッスンもあります。)

キャッチコピー:

 実務経験のあるエンジニア・孫(ソン)ハル先生が教える、フロントエンド開発入門コース!

詳細説明:

まずはPowerPointを使って、フロントエンド開発の基礎知識をわかりやすく解説します。 その後、実際の現場でも使われているソフト「Visual Studio Code」を使い、HTML / CSS / Bootstrapを用いて基本的なWebサイトを制作していく実践的なコースです。 プログラミング未経験の方も大歓迎です!一緒に楽しく学びましょう。

■ 事前準備のお願い レッスンの前に、コード編集ソフト「Visual Studio Code」のダウンロードをお願いいたします。 (※インストール方法がわからない場合はサポートしますので、ご安心ください!)

■ コースのカリキュラム予定 (※生徒さんのペースに合わせて進めます。)

<フロントエンド開発コース カリキュラム例>

01 - フロントエンドとは?(体験レッスン)

02 - Visual Studio Codeのインストール

03 - HTMLの基本構造

04 - HTML要素とリンク

05 - 画像とテーブル

06 - フォームの作成

07 - CSSとは?(概要説明)

08 - CSSの書き方とセレクター

09 - 色・文字

10 - リストのスタイル、ブロック&インライン要素、ボックスモデル、変形と遷移

11 - Bootstrapの基本紹介

12 - オリジナル作品集の開発(実践)

13 - JavaScript......

■ 日本語でのコミュニケーションについてのお願い
日常的な日本語でのコミュニケーションは問題ありませんが、まだ敬語の表現ができない場合があります。一生懸命、丁寧に教えますので、言葉遣いの間違いについては気にしないでください。 

【画像・表の追加について】
最後に記載されていた「カフェトークでの特典」「他の会社との違い対照表」については、文章の最後に以下のように見出しをつけて画像を挿入すると、生徒さんにとって見やすくなります。

 

 

 

■ ハル先生のレッスンならではの特典 & 他社スクールとの比較

Added to Saved

This column was published by the author in their personal capacity.
The opinions expressed in this column are the author's own and do not reflect the view of Cafetalk.

Comments (0)

Login to Comment Log in »

from:

in:

Преподает

Language Fluency

Китайский   Native
Японский   Daily conversation

Сейчас популярно

« Back to List of Tutor's Column
Got a question? Click to Chat