Vue.JS is a must-learn for front-end beginners!! We will thoroughly explore Vue.JS from basic to advanced levels!
Complete Vue 2 syntax.
Vue 3 basic concepts (Vue Instance, Template Syntax, Data Binding)
Composition API Usage (reactive, ref, computed, watch)
Vue Router configuration and routing
Pinia state management
Vue 3's reactivity system
Component design and data transfer (Props, Emits, Slots)
How to use Vue 3 lifecycle hooks
Composition API vs Options API
Communication with the server (Axios, Fetch, async/await)
Application performance optimization
Building and deploying a Vue app
Vue 3のコア機能であるcomputedとwatchを活用して、
人であるサイトで使用される文字数世紀機能を直接クローンコーディングしてみます。
computedを使って入力された文字数をリアルタイムで計算し、
ウォッチを活用してユーザーの入力変化を効率的に検出します。
実務で活用される機能をそのまま実装しながら、
レスポンシブデータ処理の概念を簡単かつ明確に学ぶことができます！ 🚀
Vue 3のコアコンセプトであるコンポーネント（Component）を活用して
検索エンジンサービスでよく使用されるクエリオートコンプリート機能を直接実装します。
コンポーネントの分離により、検索ボックスとオートコンプリートリストを効率的に管理できます。
propsとemetを活用して、コンポーネント間のデータフローを自然に習得します。
リアルタイムデータレンダリングで、ユーザー入力に素早く反応するインタラクティブなUI実装まで！
実務ですぐに使える機能を自分で作ってみて
Vueコンポーネントの活用方法と構造化開発方法を学ぶことができます。 🚀
Vue 3のダイナミックコンポーネント（Dynamic Component）の概念を活用して
ユーザーエクスペリエンスを向上させるタブメニューUIを直接実装します。
動的コンポーネントの切り替えにより、複数のタブコンテンツを効率的に管理できます。
v-bindとis属性を使用して柔軟なコンポーネントレンダリングを学習します。
状態管理とイベント処理により、タブ間の自然な遷移を実装します。
このプロセスにより、複雑なUIも再利用可能でスケーラブルなコンポーネントにする方法を学ぶことができます。 🚀
Vue 3で学んだすべての概念と技術を活用して
完成度の高いTodo Listアプリケーションを直接作成します。
コンポーネントの分離により、仕事の追加、削除、修正機能を効率的に管理します。
Reactiveデータバインディングは、リアルタイムの状態変化に反応するUIを実装します。
computed、watch、v-modelを活用して、状態管理とデータフローを自然に習得します。
ローカルストレージを活用してデータ永久保存機能まで実装！
このプロジェクトを通じて、Vueのコア機能を本番のように統合し、
実務ですぐに使用できる開発能力を高めることができます。 🚀
Webアプリケーションの重要な機能である認証（Authentication）と認可（Authorization）の概念を明確に理解し、
**JWT（Json Web Token）**を活用して、安全なログイン機能を直接実装してみてください。
認証と認定の違いを理論と実践を通して明確に区別します。
JWTトークンの発行と検証プロセスを通じて、安全なログインロジックを学びます。
トークンの保存と管理（LocalStorage、SessionStorage）方法を実践します。
ログイン後にユーザー情報を安全に保ち、権限に基づいてアクセスを制御する方法を学びます。
この過程を通じてフロントエンド開発者に不可欠な認証・認可概念を実戦のように経験し、
安全で効率的なユーザー管理方法を学ぶことができます。 🚀
これまでに学んだVue 3のすべての概念と技術を活用して
映画情報を提供するWebアプリケーションを直接作成します。
外部ムービーAPIを使用して、リアルタイムでムービーデータをインポートして表示します。
コンポーネント構造化により、映画リスト、詳細情報、検索機能などを効率的に管理します。
Axiosを利用したAPIリクエストと非同期処理でデータフローを制御します。
ルーター（Vue Router）を使ってページ切り替え機能を実装し、動的ルーティングも経験します。
レスポンシブUIとヘルスケアを介して、実戦のようなユーザーエクスペリエンス（UX）を提供します。
このプロジェクトを通じてVue 3のコア機能を統合的に活用し、
実務に近い開発経験とともに、APIベースのアプリケーション開発能力を向上させることができます。 🚀
学習対象は
誰でしょう？
Someone who has never studied Vue before.
Someone who has tried to study Vue, but has given up every time.
Someone who needs to build a service right away using Vue
Someone who wants to learn simply and easily without complicated explanations
前提知識、
必要でしょうか？
HTML/CSS
JavaScript
4,372
受講生
202
受講レビュー
74
回答
4.9
講座評価
7
講座
수코딩은 온라인과 오프라인을 병행하면서
코딩을 가르치는 활동을 하고 있습니다.
다년간의 오프라인 강의 경험을 바탕으로,
더 많은 사람들이 코딩을 쉽고 재미있게 배울 수 있도록
매일 고민하고, 끊임없이 노력하고 있습니다.
현재까지 다음과 같은 3권의 책을 출판하며
프런트엔드 강의 분야를 선도하고 있습니다:
또한, 유튜브 채널을 통해 다양한 무료 강의도 제공하고 있습니다.
👇 지금 바로 방문해 보세요
[유튜브 채널 링크]
全体
229件 ∙ (23時間 32分)
講座資料（こうぎしりょう）:
11. 基本構造の確認
10:51
13. npm run dev
03:59
14. アプリケーション実行順序
04:43
15. SFC
06:23
16. 実習 Exercise 1
03:28
17. (解説) Exercise 1
03:12
18. テキスト補間
03:59
19. 短縮メソッド名
01:54
全体
4件
￥9,382
知識共有者の他の講座を見てみましょう！
同じ分野の他の講座を見てみましょう！
css.png?f=avif&w=420)
![기획자님 이 정도 웹 개발은 배워보면 어떨까요? [이론+실습]Course Thumbnail](https://cdn.inflearn.com/public/courses/333579/cover/5bfdb903-721c-4e32-803b-ed0d4cfc28b7/333579.png?f=avif&w=420)