강의

N
챌린지

멘토링

N
클립

로드맵

Programming

/

Front-end

Javascript初心者Real Webアプリ開発 - パート1：Vueの概念〜初級

この講義は、初心者のJavascript開発者が直接Real Webアプリを開発できる開発者になることに焦点を当てています。 このレッスンを受講すると、Vue.jsに関連する基本的な概念からReal Webアプリを開発できます。 このレッスンはパート1の基本であり、パート2とパート3で実際のReal Webアプリを実装してみましょう。 JavascriptやCSSなどの選手知識がなくても、基本的なシンプルなHtmlだけを知っていても、 学習できるように簡単に構成しました。 講義の後半になると、明らかにVue.jsの基本的なコーディングが可能になるでしょう。

（3.1）受講レビュー 14件

受講生 209名

  • realdev91670
JavaScript
Vue.js
Web Application

学習した受講者のレビュー

こんなことが学べます

  • レスポンシブWeb開発

  • Webアプリ開発

  • Vue.js入門～初級

  • Vue.js公式ガイドエラーの解決

  • Frontendの開発

  • Javascript開発

  • Vue.js初級開発

  • Vue、PWA、SPA、SFCなどVueに関連する基本概念を理解する

  • VueインスタンスとVueの基本文法と主要文法を理解する

【お知らせ】 1. 講義録画に対する音質、編集など技術的に不足している部分が多いです。内容面でも最初の講義と足りない部分があります。

2. 講義中に Vue.js 公式ガイド中にコア文法中にエラーを発見し、解決してガイドします。

パート2から進行される実際のWebアプリ開発のために入門者の方に必要な、基本基礎講座です。

Vue.js に関する基本知識をお持ちの方、または既に勉強になっている場合は、あえて受講しないでください。

ありがとうございます。

講師ブログ講義プレビュー - > https://plogger.tistory.com/category/Frontend/Vue

[Vue.js 2]本番Webアプリを開発するシリーズ

•パート1：Vue.jsの概念〜コア👈現在の講義
•パート2 - Vue Cli開発環境と実践UIライブラリ（制作中）
• パート3 - 実践ウェブアプリ「アプリとする歴史勉強」開発（制作中）

📝講義紹介

•パート1：Vue.jsの概念〜コア練習

レッスンを見ながら、 jsFiddleを使ってすぐにコーディングすることができます。

このような実践は、講座を目でしか見ることとは異なり、

あなたが実際のVue.jsの基本的なコーディングをすることができるように

明らかに助けることができます。講義を見ながら一緒にコーディングしてみてください。

あなたは正しいvue開発者になることができます。

旧韓末朝鮮をめぐる列強たちの侵略に対するドキュメンタリーを見ながら、
開花期の朝鮮と日本をはじめとする他の列強たちの歴史は大きく異なっていたことがわかりました。
今は4次産業革命時代ですが、1次産業革命（1760年代）、2次産業革命（1865年代）時代に
朝鮮は何をしていたのだろうか？という気がしました。
朝鮮はなぜ産業革命の時期に他の国々に比べてこんなに遅れてしまい、
朝鮮を脅かす列強（日本、中国、ロシア、アメリカ、イギリス、フランスなど）は、同時代にどんな歴史を成し遂げてきたのか気になりました。

勉強しながらこれをウェブアプリにして効果的に知りたいと思う
「アプリとする歴史勉強」というWebアプリをVue.js + Vuetifyにするようになりました。
アプリを作成しながら、私もそうだったように、誰かにコーディングが必要な瞬間、
キットとマニュアルになってくれるツールをサービス[ http://realcodecamp.com ]で作ってみることにしました。

Real Webアプリ - 「アプリとする歴史勉強開発」をまず動画講座に進めようとしたが、
基本機なしでまさに本番開発は難しいという考えで
•パート1 - Vue.JSの概念〜コア実践
•パート2 - Vue Cli開発環境と実践UIライブラリ
を最初に追加しました。

本講義は第1部 - Vue.JSコンセプト～コア実習部分です。

[講義に収録されたReal Webアプリ]
「アプリにする歴史を勉強する」プレビュー👀

🙌ここで扱うツール

JSフィードル(JSFiddle)
•Webフロントエンド関連の技術コード（コラボレーションHTML、CSS、JavaScriptコードスニペット）を作成してテストするためのオンラインサービス。

ビジュアルスタジオコード (Visual Studio Code)
•Microsoftが開発したGit制御、構文強調機能などを含むソースコードエディタ/デバッガ。

🙋🏻‍♂️講義のQ&A

Q. 非専攻者も聞くことができますか？
A. はい、聞くことができます。開発への熱意だけがあれば誰でも聞くことができます。私も非専攻者です。

Q.なぜVue.jsを学ぶべきですか？
A. 今でもそうですが、今後のWeb開発はPWA（Progressive Web App、講義で詳しく説明します。）の形で開発が行われます。 Vue.jsは、一般的なWeb画面に加えて、このPWAを開発するのに非常に簡単なフレームワークです。 Vue.jsを使用すると、1つの開発でWebとモバイルの両方を満たすことができるWebアプリを作成できます。

Q. Vue.jsを学ぶとどうなりますか？
A. Vue.jsを学ぶことで、あなたはフロントエンド開発者になることができ、進歩的なWebページ開発とWebアプリ開発をすることができます。

こんな方に
おすすめです

学習対象は
誰でしょう？

  • プロジェクト、進路、就職に役立ちます。

  • Vue.js入門、初級開発者

  • Frontend 開発者

  • Javascriptの開発に興味がある方

  • Javascript開発者

  • Web開発者

  • Webアプリ開発に興味のある方

  • WebパブリッシャーやWebデザイナーの方

  • angularjs, angular に触れてみた方

前提知識、
必要でしょうか？

  • html

こんにちは
です。

209

受講生

14

受講レビュー

3.1

講座評価

1

講座

국내 다수의 대기업(삼성, LG, SK, KT등) 에서 10년이상 웹 프로젝트 및 웹 솔루션 개발을 해왔습니다.

프론트앤드-백앤드 개발 및 AA 및 PL 역활을 담당하였습니다.

안드로이드 앱 개발을 통해 다양한 실전 앱(구글 플레이 10만명 이상 다운로드)을

개발 및 운영해 보았습니다.

최근 5년동안에는 Angular.js, Vue.js 와 같은 프론트앤드 개발을 메인으로 진행해왔습니다.

현재는 스타트업 에서 AA 및 웹앱 개발을 담당하고 있습니다.

  • 프로젝트의 생산성을 높이는 방법은 무엇일까요? 어떻게 하면 보다 더 빠르게 좋은 프로젝트를 구현할 수 있을까요?
  • 효율적인 서비스와 개발을 위해서는프론트 엔드와 백엔드 는 어떻게 바인딩 되어야 할까요?

강의를 통해, 프론트 엔드 개발과 백엔드 개발의  실전 가이드라인을 제시하고 싶습니다.

カリキュラム

全体

24件 ∙ (4時間 44分)

講座資料（こうぎしりょう）:

授業資料
講座掲載日: 
最終更新日: 

受講レビュー

全体

14件

3.1

14件の受講レビュー

  • gorebab70114님의 프로필 이미지
    gorebab70114

    受講レビュー 1

    ∙

    平均評価 5.0

    5

    8% 受講後に作成

    全体的にビュー使用において多くの理解になりました。

    • realdev91670
      知識共有者

      よろしくお願いします。今後より良い講義をご用意させていただきます。

  • tommykjw0181님의 프로필 이미지
    tommykjw0181

    受講レビュー 1

    ∙

    平均評価 5.0

    5

    63% 受講後に作成

    vue.jsの基本文法を簡単に説明します

    • realdev91670
      知識共有者

      良い受講評価ありがとうございます。 録音音質や改善が必要な部分はもう少しアップグレードをしてみます。

  • isunwoo06308400님의 프로필 이미지
    isunwoo06308400

    受講レビュー 1

    ∙

    平均評価 5.0

    5

    29% 受講後に作成

    学習中に講義の音質や内容が改善になったようです。 Vue学習に多くの助けになりました。

    • candys2aaa4158님의 프로필 이미지
      candys2aaa4158

      受講レビュー 4

      ∙

      平均評価 5.0

      5

      42% 受講後に作成

      理解が上手くなり、Vue関連ウィンドウもすべてよく見せてくれて理解しやすかったです。

      • realdev91670
        知識共有者

        良い評価、本当にありがとうございました。

    • jcpdh10041님의 프로필 이미지
      jcpdh10041

      受講レビュー 1

      ∙

      平均評価 5.0

      5

      13% 受講後に作成

      ビューを勉強する上で、一人で勉強するより、素早く基礎を固めることができていいようです。

      ￥1,364

      似ている講座

      同じ分野の他の講座を見てみましょう！

      React を学びながら作成する: 基本강의 썸네일

      React を学びながら作成する: 基本

      jayjinjay

      リアクトを最も簡単かつ迅速に学べるリアクト入門講義です。トイプロジェクトを作りながらコンセプトと実戦感覚を身につけ、配布まで3時間で完成するアルチャ講義！初級、中級、上級のシリーズの最初のレッスンです:)

      초급

      초급

      React, JavaScript

      React を学びながら作成する: 基本강의 썸네일

      React を学びながら作成する: 基本

      jayjinjay

      Angular、アンギュラ100分コア講義강의 썸네일

      Angular、アンギュラ100分コア講義

      nomad

      このコースはAngularに基づいて簡単ですが、便利なpetlistプロジェクトを100分のコアレッスンに短縮することで、短時間で本番に活用できるモバイルWebアプリの開発能力を高めることができます。

      초급

      초급

      JavaScript, Angular

      Angular、アンギュラ100分コア講義강의 썸네일

      Angular、アンギュラ100分コア講義

      nomad

      実習でマスターするOAuth 2.0：基本からセキュリティリスクまで강의 썸네일

      実習でマスターするOAuth 2.0：基本からセキュリティリスクまで

      hannut911327

      OAuth 2.0をGoogleやFetchのようなアカウントで簡単ログインを試してみて既におなじみに感じられるかもしれません。ソーシャルログインはOAuth 2.0を拡張して作成されたもので、コア技術はOAuth 2.0認定フレームワークにあります。 OAuth 2.0の原理を理解すれば、それに基づいて必要に応じて適切に実装および調整する能力を育てることができます。

      초급

      초급

      OAuth, Next.js, JavaScript

      実習でマスターするOAuth 2.0：基本からセキュリティリスクまで강의 썸네일

      実習でマスターするOAuth 2.0：基本からセキュリティリスクまで

      hannut911327

      プログラミングの始め方：Web入門（Inflearnオリジナル）강의 썸네일

      プログラミングの始め方：Web入門（Inflearnオリジナル）

      inflearn

      初めてプログラミングを始める方のためのWeb開発入門講座です。HTML、CSS、Javascriptを学び、Instagram投稿カードを作成することで、Webページ作成に不可欠な基本的な内容を学びます。

      입문

      입문

      HTML/CSS, JavaScript

      プログラミングの始め方：Web入門（Inflearnオリジナル）강의 썸네일

      プログラミングの始め方：Web入門（Inflearnオリジナル）

      inflearn

      コロナマップ開発者との指導サービスの作成1강의 썸네일

      コロナマップ開発者との指導サービスの作成1

      donghunee

      コロナマップ開発者が知らせる指導サービス作り講義です。

      초급

      초급

      Node.js, Web Application, Express

      コロナマップ開発者との指導サービスの作成1강의 썸네일

      コロナマップ開発者との指導サービスの作成1

      donghunee

      フルスタックのための堅実なフロントエンドブートキャンプ (HTML, CSS, バニラJavaScript + ES6) [フルスタック Part2]강의 썸네일

      フルスタックのための堅実なフロントエンドブートキャンプ (HTML, CSS, バニラJavaScript + ES6) [フルスタック Part2]

      funcoding

      現場で実際のウェブサービスを開発した経験に基づき、初心者向けに実際の商用化も可能なレベルのウェブおよびアプリサービスを開発することを目標とするフルスタックシリーズ講座です。そのためのPart2講座として、多様な技術が存在するフロントエンド技術の中から、レスポンシブ、互換性まで考慮した最新のHTML5、CSS3、バニラJavaScript（Javascript）+ ES6をすべてしっかりと整理する講座です。

      입문

      입문

      HTML/CSS, JavaScript, ES6

      フルスタックのための堅実なフロントエンドブートキャンプ (HTML, CSS, バニラJavaScript + ES6) [フルスタック Part2]강의 썸네일

      フルスタックのための堅実なフロントエンドブートキャンプ (HTML, CSS, バニラJavaScript + ES6) [フルスタック Part2]

      funcoding

      純粋関数型フロントエンド言語 Elm ガイド강의 썸네일

      純粋関数型フロントエンド言語 Elm ガイド

      hatemogi

      純粋な関数型プログラミングでフロントエンドWebアプリを作成するElmプログラミング言語ガイドのドキュメントを3時間で勉強します。

      초급

      초급

      elm, Functional Programming, SPA

      純粋関数型フロントエンド言語 Elm ガイド강의 썸네일

      純粋関数型フロントエンド言語 Elm ガイド

      hatemogi

      [コードファクトリー] [入門] 9時間で終わるコードファクトリーのJavascript無料フルコース강의 썸네일

      [コードファクトリー] [入門] 9時間で終わるコードファクトリーのJavascript無料フルコース

      codefactory

      この 1 つのコースだけで、人気のある Javascript フレームワークと Typescript の基本を学ぶことができます。

      입문

      입문

      JavaScript

      [コードファクトリー] [入門] 9時間で終わるコードファクトリーのJavascript無料フルコース강의 썸네일

      [コードファクトリー] [入門] 9時間で終わるコードファクトリーのJavascript無料フルコース

      codefactory

      バイブコーディング With Claude Codeでウェブサービス作り강의 썸네일

      バイブコーディング With Claude Codeでウェブサービス作り

      ref63184917

      現職スタートアップCTOが実際のサービスと複数の外注を通じて得たバイブコーディング知識をお伝えします。

      입문

      입문

      HTML/CSS, JavaScript, Next.js

      バイブコーディング With Claude Codeでウェブサービス作り강의 썸네일

      バイブコーディング With Claude Codeでウェブサービス作り

      ref63184917

      Firebase シリーズ #2: AI 漢字推薦 & 筆記学習プラットフォーム강의 썸네일

      Firebase シリーズ #2: AI 漢字推薦 & 筆記学習プラットフォーム

      dakgangjung123

      🔥 漢字学習のためのカスタムプラットフォーム構築！ Google Gemini AIとFirestoreを活用し、自分だけの漢字単語帳、画数アニメーション、手書き認識まで直接実装してみましょう！

      초급

      초급

      gemini, HTML/CSS, TailwindCSS

      Firebase シリーズ #2: AI 漢字推薦 & 筆記学習プラットフォーム강의 썸네일

      Firebase シリーズ #2: AI 漢字推薦 & 筆記学習プラットフォーム

      dakgangjung123

      誰でも簡単に始めるウェブ開発基礎 (Basic Web Development Course)강의 썸네일

      誰でも簡単に始めるウェブ開発基礎 (Basic Web Development Course)

      pnuswedu

      基本的なウェブサイト構築方法を習得し、公共データOpen APIを連携した実戦プロジェクトを通じて、Web開発の基礎から実務適用能力まで！

      입문

      입문

      HTML/CSS, JavaScript, openAI API

      誰でも簡単に始めるウェブ開発基礎 (Basic Web Development Course)강의 썸네일

      誰でも簡単に始めるウェブ開発基礎 (Basic Web Development Course)

      pnuswedu

      ユン・ジェソンの最初のスタートアップ JavaScript Tutorials강의 썸네일

      ユン・ジェソンの最初のスタートアップ JavaScript Tutorials

      softcampus

      JavaScript言語の概要、基礎文法、提供ライブラリまで、JavaScriptの全体的な内容を学ぶことができます。

      입문

      입문

      JavaScript

      ユン・ジェソンの最初のスタートアップ JavaScript Tutorials강의 썸네일

      ユン・ジェソンの最初のスタートアップ JavaScript Tutorials

      softcampus

      モバイル、タブレット、pcレスポンシブインスタグラムクローンコーディング강의 썸네일

      モバイル、タブレット、pcレスポンシブインスタグラムクローンコーディング

      jeong4726

      この講義を通じて、受講生はHTML、CSS、JSでインスタグラムに似たWebサービスを作成することができます。 （フロントのみ実装しました！バックエンドサーバー構築は今後講義撮影予定です。）

      초급

      초급

      HTML/CSS, JavaScript, Clone Coding

      モバイル、タブレット、pcレスポンシブインスタグラムクローンコーディング강의 썸네일

      モバイル、タブレット、pcレスポンシブインスタグラムクローンコーディング

      jeong4726

      非専攻者でも可能なAIバイブコーディング入門コース강의 썸네일

      非専攻者でも可能なAIバイブコーディング入門コース

      itconnect

      💡 非開発者もAIと一緒にたった10時間で創業MVPから収益化サービスまで！ 💰 外注費数千万円が必要だった開発、今や12万円で完全解決 🎯 名刺認識、感情分析、立地分析まで実戦ビジネスプロジェクト5個完走 🔥 企画者、マーケター、予備創業者なら開発者なしでもアイデア実現 ⚡ 今始めれば一生使える開発自立能力を獲得しましょう！

      입문

      입문

      HTML/CSS, Java, Web Application

      非専攻者でも可能なAIバイブコーディング入門コース강의 썸네일

      非専攻者でも可能なAIバイブコーディング入門コース

      itconnect

      Webゲームを作って学ぶインタラクティブWeb！ JAVASCRIPT

      ggangcoding162118

      Webゲームも作って、フロントエンドWeb開発スキルも学ぶ1席3組授業！

      초급

      초급

      Interactive Web, JavaScript, HTML/CSS

      Webゲームを作って学ぶインタラクティブWeb！ JAVASCRIPT

      ggangcoding162118

      クリーンアップ JavaScript: ベース構築!강의 썸네일

      クリーンアップ JavaScript: ベース構築!

      tonextday

      考え方を扱います。JavaScript の核心と本質を論理的に整理できます。JavaScript の経験を整理して、考え方を自分で整理できます。JavaScript の技術論理を確立できます。JavaScript 全体を見渡す視野を広げることができます。JavaScript の技術面接問題に対応できます。

      초급

      초급

      JavaScript, Interview, Tech Interview

      クリーンアップ JavaScript: ベース構築!강의 썸네일

      クリーンアップ JavaScript: ベース構築!

      tonextday

      Python WebサービスAPI本番プロジェクト - お金を稼ぐデジタルマーケティング강의 썸네일

      Python WebサービスAPI本番プロジェクト - お金を稼ぐデジタルマーケティング

      nomad

      ネイバーショッピング、クパンパートナーズなどお金を稼ぐデジタルマーケティングは着実さも必要ですが、科学的な分析と自動化で簡単かつ効果的にアプローチしてください。人気商品、キーワード、ブログ、ショッピング情報を収集して分析するプログラムを作成するための重要な法律をお知らせします。

      초급

      초급

      Digital Marketing, Python, Web Application

      Python WebサービスAPI本番プロジェクト - お金を稼ぐデジタルマーケティング강의 썸네일

      Python WebサービスAPI本番プロジェクト - お金を稼ぐデジタルマーケティング

      nomad

      Klaytn ブロックチェーン アプリケーションの作成 - NFT강의 썸네일

      Klaytn ブロックチェーン アプリケーションの作成 - NFT

      SEJONG IT EDU

      この講座では、代替不可能なNFT（Non Fungible Token）を活用して、非アプリを作成することができます。

      중급이상

      중급이상

      Web Application, Blockchain, NFT

      Klaytn ブロックチェーン アプリケーションの作成 - NFT강의 썸네일

      Klaytn ブロックチェーン アプリケーションの作成 - NFT

      SEJONG IT EDU

      JavaScript サーバープログラミング基礎강의 썸네일

      JavaScript サーバープログラミング基礎

      zdpk

      JavaScriptベースのWebフレームワークExpress.jsを使用してサーバーコードを作成し、基礎的な使用法およびサーバーの動作原理を理解します。 フロントエンドも本質的にはサーバーが必要であり、static serving、dynamic renderingなどの様々な技法が生まれる過程を学習し理解度を高めます。

      입문

      입문

      JavaScript

      JavaScript サーバープログラミング基礎강의 썸네일

      JavaScript サーバープログラミング基礎

      zdpk

      JavaScript 機械学習 TensorFlow.js강의 썸네일

      JavaScript 機械学習 TensorFlow.js

      tonextday

      JavaScript 環境で機械学習の概念を扱います。 JavaScript と TensorFlow.js を使って機械学習を実装する形式とコードを扱います。

      중급이상

      중급이상

      Tensorflow, JavaScript, Machine Learning(ML)

      JavaScript 機械学習 TensorFlow.js강의 썸네일

      JavaScript 機械学習 TensorFlow.js

      tonextday