本講義は、フルスタック講義シリーズPart2の講義として、Pythonバックエンド(Part1)講義に続き、フルスタックに必要な確かなフロントエンドの基礎を身につける講義です。商用化も可能なWebサービス開発に必要なHTML5、CSS、JavaScript(VanillaJS、バニラJavaScript)+ES6を詳しく整理し、習得する講義です。
一般的なIT講義よりも、できる限り受講者の立場に立って考えて作った特別な講義です。さまざまな資料や例を通して、関連技術を知らない状態から始め、関連技術を自分の履歴書に記載できるほど、核心的な技術を確実に身につける講義です.
本講義は、これまで多くの方に学んでいただき、良いご意見をいただいている実績のある講義です。
万が一問題があった場合は、今後もこれまでと同様に随時アップデートされることがあります。
フロントエンドの基礎をしっかり身につけたいなら?
프론트엔드 기본 기술을 탄탄히 정리해야 합니다. 프론트엔드 기본은
HTML, CSS, Javascript 입니다. React 를 익히더라도, 프론트엔드 기본이 필요합니다. 탄탄한 프론트엔드 기본기가 핵심입니다. 꼼꼼하게 잘 쌓은 기본기 위에, React 든 Flutter 든 익히면 프론트엔드를 원하는대로 만들 수 있습니다. 여기에 최신 웹페이지는 반응형, 호환성등 정리해야할 배경지식과 관련 지식이 있고, 오래전 기술인 Jquery 를 깔끔한 Javascript 로 대체해야 합니다.
何となく知ってはいるものの、整理できていない気がします
HTML、CSS、Javascriptはなんとなく使える気がしても、実際に使ってみると思い通りに扱うのは難しいものです。レスポンシブ、互換性、ES6など、散在する数多くの文法や技術、特にフロントエンドは、一度きちんと整理しておかないと思った以上に難しいものです。
フルスタックになれば、Webサービスを一人でも作れるそうですが…… thì có thể tự mình tạo ra dịch vụ web...
Webでもアプリでも、最近のサービスを実装するには、バックエンド、フロントエンド、デプロイ技術が必要です。これをフルスタックといいます。フルスタックになれば、1人でも最新のWebサービスを作ることができ、競争力のある開発者にもなれます。
これを最も効果的かつ実践的に進めるには、フルスタック講義Part1でPythonとバックエンド技術を身につけ、Part2でフロントエンドの基礎力を磨く必要があります。 基礎力がしっかり身についてこそ!講義に出てきたWebサービスをただそのまま写して作るのではなく、本当の意味でフルスタックになれます。本講義では、フロントエンドの基礎力をしっかり身につけられるよう、HTML5、CSS、Javascript(バニラJavaScript、VanillaJS)+ ES6を詳しく扱います。
全体で最も速く最新のフルスタックロードマップをYouTube動画にまとめました。この動画を参考にしていただければ、本技術にとどまらず、独学でも短期間でWeb/アプリ開発ができるロードマップもご理解いただけます。
確固たる実践的なフロントエンドの基礎力を身につけるために作成しました。.
数え切れないほど多くの文法や機能があるため、フロントエンドはまず「整理」というキーワードから始める必要があります。
その多くて多様な文法や知識を、以下の条件のもとで整理しました。
- 最新のウェブサイト開発に必要な基礎知識をすべて整理し
- 그럴듯한 웹페이지를 위해 꼭 필요한 CSS를 꼼꼼히 정리하고
- 最新のウェブページでは使われていないJQueryは扱わず
- すべて標準のVanilla JavaScript + ES6に置き換えて扱い
- レスポンシブに対応し
- 互換性まで考慮します
HTMLタグは軽く、セマンティックタグを含めて本当に必要なタグだけを中心に整理し、
それらしいWebページの実装に欠かせないレスポンシブ対応や互換性まで考慮した、詳細なCSS機能を扱い、
VanillaJS(バニラJavaScript)と呼ばれているように、最近のトレンドではjQueryを使用しないため、互換性まで考慮したJavaScript + ES6の文法だけでWebページを実装します。
各機能について、互換性の問題で使用できない極めて最新の文法や、代替可能な技術は除外し、核心となる技術に集中します。
時間を無駄にしないでください!
私たちは情報がないからできないのではありません!
実証済みの講義で学べば、素早く整理できます!
JavaScriptだけ学べばよいのではありませんか?
フルスタック開発における最大のボトルネックはCSSです。HTMLやCSSは中学生でも知っていると言われます。
しかし、相当なフロントエンド開発者でなければ、レスポンシブ対応や互換性を確保し、見栄えのする最新のWebページを作ることはできません。
数え切れないほど多くの細かなCSS機能を整理する必要があります。HTMLも標準に沿って、一度は整理しておく必要があります。
また、国内にはパブリッシャーという職種がありますが、海外ではフロントエンドまたはフルスタック開発者がCSSまですべて担当します。
競争力のあるフロントエンド/フルスタック開発者になるためには、CSSの機能を詳しく整理することが不可欠です。
React、Vueを習得しなければWebサービスは作れないのではありませんか?
このフレームワークは、JavaScriptの弱点を改善するためにJavaScriptで作られたフレームワークです。これらのフレームワークを使う際にもJavaScriptを使うため、どのフレームワークであってもJavaScriptの基本文法をしっかり整理して身につけておく必要があります。本講義で扱うHTML、CSS、JavaScriptの基礎がしっかり身についてこそ、それを土台にReact、Vueなどのフレームワークを学ぶことができます。
そのため、本講義はフロントエンドの基礎力に重点を置いた講義です。本講義では、確かな基礎力を身につけるために、関連技術の中で必須となる技術をすべて整理し、練習します。
初心者でもできますか?
初心者の方にも受講していただけるよう、詳しく丁寧に順を追って説明する講義です。
IT講義で最も難しいのは、プログラミングをまったく知らない方にプログラミングを教えることです。そのような方々も、私が公開したPython入門とクローリング基礎ブートキャンプ講義を通じて、プログラミングだけでなくクローリング技術も身につけました。合理的に考え、お互いに配慮できる方であれば、十分に可能です。
フロントエンド技術だけを早く整理したい場合は、本講義だけを受講していただいても構いません。ただし、プログラミングに一度も触れたことのない完全な初心者の方には、Python入門とクローリングブートキャンプ講義と併せて、ロードマップに沿ってフルスタック講義を一歩ずつ学んでいくことをおすすめします。必要なスキルをより着実に身につけていくことができます。
入門者にも理解できるように
簡潔でありながら、丁寧に作成された資料をもとに、
講義中に各自でテストも行えるよう
機能別のサンプルコードを使ってすぐにテストまで実施できます

• 各機能のサンプルコードをプロジェクトとして作成して提供し、実践的なWebページのコードファイルも提供します。
• 講義資料はオンラインでいつでもご確認いただけるよう提供します(ただし、コピーおよびダウンロードは著作権上の理由により制限しています)。
体系的に学ぶことができるでしょうか? không?
入門者から始めてフルスタックになるまでの全過程を、少しずつ難易度を上げながら、詳しく体系的に学べるよう講義を作っています。該当する文法や知識の理解を助けるため、簡潔なコードと十分な説明を行い、理解が必要な部分についてはその都度コンピューターサイエンスにまで踏み込んで解説し、優れた開発者になるための基礎力を身につけられるようにしています。

本講義はフルスタック講義シリーズ全体のPart2として、本講義では次のサービス開発に向けた特定のウェブページを選び、フレームワークやライブラリを一切使わず、空のファイルから始めて、HTML、CSS、Javascript + ES6を使用し、一つひとつコードを完成させるところまで一緒に進めていきます。
'あ!本当に違うんだ!'と感じていただけるように
考え抜いて作った講義です
そのままついてきていただければ、大丈夫です!