デイトラのロゴ

Webアプリ開発コース初級編

WEBサイトとミニアプリを作れるようになろう

HTML・CSS基礎編
DAY 0
はじめに

デイトラWebアプリ開発コースへようこそ!

こちらではデイトラのサポートの受け方や学習の進め方などをご紹介しています!

学習を始める前にしっかりとご一読ください😊


TIPS

01.学習を始める前に ① - デイトラのサポートの受け方

デイトラのサポートの受け方

デイトラの使い方について、動画で紹介しています!
まずはこちらから確認してみましょう😊!


Discordに加入しよう!

デイトラではメンターによる学習サポートがついています!

サポートはDiscordというチャットツールで行います。学習を進める中で疑問があれば遠慮なくDiscordの「質問部屋」で聞いてください!

↓アプリ開発コースのダッシュボードの案内よりご参加ください!

ダッシュボードに移動する

Discordの連携方法(解説動画) ※この動画には音声はございません! 

各部屋のご紹介

  • はじめに必ず読んでください : Discord参加後、最初にご覧ください。
  • イベント : ウェビナーやオフ会などのイベント情報、案件案内などを確認できます!
  • 【全体】運営からのお知らせ : 運営からの連絡や、イベントのお知らせが届きます。
  • 運営からのお知らせ(コースごと) : コースの受講生へのご連絡や、メンターからのお知らせが届きます。
  • 自己紹介部屋 : 自由に自己紹介をしましょう!
  • 質問部屋 : 質問がある場合はこちらで! 他の人の質問からも学べることがあります!
  • 雑談部屋 : 雑談や目標宣言など、自由に交流できる部屋です!
  • ai質問部屋:AIチャットボット「デイトラちゃん」に質問することができます!

02.学習を始める前に② - 学習の進め方・上手に質問するためのポイント

学習の進め方


Discord参加後の「はじめに必ず読んでください」にも掲載していますが、Webアプリ開発コースの進め方については、こちらもご覧ください👇

Webアプリ開発コースの進め方
【必読!】Webアプリ開発コースの進め方


上手に質問するためのポイント

デイトラではメンターへ好きなだけ質問することができます。

分からないことをすぐ聞ける環境は、成長速度を圧倒的に速めてくれますが、質問の仕方には注意が必要です。

何か問題が起きたとき、「なんか動かないです」と丸投げするような質問の仕方をしては、回答もできませんし、自分のためにもなりません。

問題を自分で解決するスキルや、起きている問題を正しく伝え、助けを借りて素早く解決するスキルもエンジニアには大切なのです。

それに「上手な質問」ができるとメリットだらけ!

  • 答えが短時間で返ってくる
  • 情報処理力・問題解決力が上がる
  • 整理してる間に自己解決することも多数
  • 周りから一目置かれる

結果、何も考えず適当に質問するより圧倒的に成長速度が早まります!!

ぜひ↓の”質問の仕方”を見て学習効率を高めてください。


以下、上手に質問するためのテンプレートです。この順番に書いていけばOKです!
※ Discordの質問部屋で質問する際もルールとして使ってください!

上手に質問するためのテンプレート
  1. 詰まっている箇所(〇〇編DAY〇〇)
  2. 聞きたいことの一行まとめ
  3. 起きている問題(起きている現象の詳細/エラーメッセージ/スクリーンショット)
  4. ソースコード(関連するソースコード/全ソースコード)
  5. 問題解決するために試したこと(コードもあれば追記) 
  6. 問題について自分なりに考えたこと(デバッグ結果/検索結果/自分なりの原因予想)


質問の仕方について、さらに詳しく解説している動画がこちらです👇

あわせて確認しておきましょう!

評価されるエンジニア・プログラマーになるために


記事版


受講生の皆さんには、開発の技術的な知識をお伝えするだけじゃなく、成長するための大切な考え方や、自走力を育む学習の仕方も、課題を通してお伝えしたいと思っています。

正しい質問の仕方もその一つです。ぜひやってみてください!

動画の中で説明している Gist の使い方は以下の動画で紹介しています。

以下に動画内で紹介したアプリのリンクを貼っておきます。

  1. KAP https://getkap.co/
  2. Gist https://gist.github.com/

03.学習を始める前に③ - 解説動画を見やすくする方法

デイトラで学習を行うときは、以下に紹介する機能や設備を利用することで学習効率が格段にアップします。

作業環境を整えて効率的に学習を行っていきましょう!


ピクチャ・イン・ピクチャ機能を活用しよう!

デイトラでは、カリキュラム内で動画を使用しています。

埋め込まれた動画はデフォルトのサイズのみでなく、動画の右下にある「ピクチャ・イン・ピクチャ」というボタンを押すことで画面サイズを自由に変えつつ好きな場所に表示できるようになります。

エディタにコードを書きながらの動画視聴もしやすくなると思うので、ぜひこのピクチャ・イン・ピクチャ機能を覚えておきましょう!


また、ピクチャ・イン・ピクチャの左隣の「設定」ボタンから、動画の再生スピードも変えられます。

「解説が早くて追いつかない...」という時は、再生スピードを落として視聴してみてください👍

デュアルディスプレイの導入もおすすめ

Webの仕事をする際には、

  • デザインツールを見ながらコーディングする
  • 参考資料を見ながらテキストを打ち込む

上記のような複数の作業を同時に行うのが当たり前になってきます。

そんなときに便利なのがデュアルディスプレイです!

デュアルディスプレイを使えば複数の画面を同時に表示することができるので、作業効率が格段に上がります

上記で説明したピクチャ・イン・ピクチャ機能も便利ですが、そもそもMacの12インチや13インチを使ってる人だと元の画面が小さすぎて見にくいので、効率を求める方はぜひデュアルディスプレイも検討してみてください!

デイトラの学習中も「片方で解説を全画面表示にしながら片方でコードを書く」という使い方ができるので学習効率が段違いです。


入門には下記の1万円台で買えるディスプレイがおすすめです。


04.学習を始める前に④ - デイトラコミュニティのご紹介


デイトラコミュニティでできること

  • 業界トップランナーによるオンラインセミナー受け放題!
  • 各コースのメンターに直接相談できる機会がある!
  • 学習しながら交流が生まれる「オンライン自習室」
  • 「チーム企画」など、コミュニティメンバー限定企画やイベント
  • 多彩なテーマのチャットルーム!
  • オンライン交流会👫 etc…

『デイトラコミュニティ』は、上記のような盛りだくさんのコンテンツや企画がつまった、デイトラ生が集まる交流の場です!
(※学習サポート用Discordとは異なり、別途任意で参加いただくサービスとなっています。

今ならキャンペーンとしてなんと初月無料でご利用いただけます❗

「学習に躓きかけた時も、仲間と繋がって情報を共有したり先輩の話を聞くことで乗り越えられた!」という声も多くいただいています😊
たくさんのデイトラ生が参加して一緒に切磋琢磨しているので、是非この機会を活用してください👍

05.学習を始める前に⑤ - さいごに


以下にデイトラ卒業生のインタビュー記事や、過去に行われた座談会イベントについて紹介します!

学習の進め方のポイントや、将来像のイメージとして是非参考にしてみてください😊

デイトラ座談会

過去に開催された座談会イベント『デイトラ9DAYS』の内容をギュッとまとめた記事です。
座談会では、デイトラ受講後の働き方について、有志の方からリアルな体験談を詳しく伺っています!

https://www.tokyofreelance.jp/webapplicationdevelopment-symposium/

▼イベントアーカイブ動画

実際の座談会の様子は、動画にもなっているので是非👇


【インタビュー記事より抜粋!】Webアプリ開発コース受講生の声

受講生より、喜びの声が多数寄せられています!

各受講生への詳しいインタビュー内容は次項で紹介しているリンクから、ご覧いただけます。

▼Webアプリ開発コース受講生:Katsuさん

未経験からデイトラWebアプリ開発コースを受講し、1年ほどの現場経験を経てフリーランスエンジニアになったKatsu(@katsucode)さんに独立までの全過程を伺いました!

https://www.tokyofreelance.jp/katsu-interview/

▼他にも活躍中の受講生の生の声がたくさん!

そのほかのインタビュー記事については下記リンクよりご覧いただけます。