プログラミング入門ナビ by Proglus（プログラス）

プログラミング学習初心者のための情報メディア

本ページにプロモーションが含まれる場合があります

You are here: Home / 2018 / Archives for 11月 2018

Archives for 11月 2018

Udemy（ユーデミー）が2018年最大級のブラックフライデーセール開催！

By

世界最大級のオンライン学習サイトUdemy（ユーデミー）が、1年間で最大級となるセール「ブラックフライデーキャンペーン」を大々的にスタートしました！

ブラックフライデーというのは、アメリカで毎年11月の第4木曜日に催される「感謝祭」の翌日の金曜日のことです。年末商戦の初日と位置づけられ、各社が1年で最大級のセールを行います。

Udemy セール 実施期間

2018年11月14（水）～

Udemyとは

Udemy（ユーデミー）は、「世界最大級のオンライン学習プラットフォームです。
米国シリコンバレー発祥のUdemyは、学びたい人と教えたい人をつなぐCtoCの学習マーケットプレイスです。

2010年の設立以来、2,000万人以上の生徒が
プログラミングからヨガ、写真に至るまで、あらゆるコースを受講しています。

実績のある講師陣が教える8万以上の種類の講座を、
オンデマンドで、いつでもどのデバイスからでも自分のペースで学ぶことができます。

海外初のサービスだと不安な方もいるかもしれません。
でも、とても安心できるサービスです。
なぜならば、日本では教育大手でこどもちゃれんじや進研ゼミを手がける、ベネッセコーポレーションがマーケティングパートナーとして協力しているからです。

サポートの対応はとても親切で好感が持てます。
もちろん日本語でやり取りができますよ。

Udemyをおすすめする理由

なぜおすすめかというと、ITの最先分野に精通したエキスパートのオンライン講座を、安価（1講座、1,200円〜）に受講できるからです。

現役で活躍されている講師が、現場で使えるフレッシュなテーマを提供していることが多いのも特徴です。

動画を見るだけでなく、実際に手を動かしながら学ぶスタイルを取る講師が多いので、実務で使えるスキルが身につきます。

独学と違って、コースを受講する中で発生した不明点はQ＆A形式で講師手厚くサポートするので、安心です。

書籍で独学する方法では、気軽に著者に質問はできないですよね？

毎月定額で発生するサービスと違って、一度購入したコースは、無期限に視聴できるのもメリットです。

仕事が忙しくても、自分のペースで学習することができます。

安心の30日間返金保証があるので、気軽にコースを受講し始めることができます。※iOSモバイルアプリからの購入は対象外

購入してみたものの、思ってた内容と違ったと思ったら、30日以内に返金すれば、リスクはありません。

Udemyのサイトを見ていると、今後学びのスタイルが大きく変わっていくと実感できるはず。

思い立ったら、今すぐ、確認してスキルアップしましょう！

あなたの昇給や報酬UPにつながるコースがきっと見つかるはず！？

Udemy（ユーデミー）のおすすめコース

プログラミング入門ナビが読者の皆さんのために選んだ、Udemyおすすめのプログラミングコースとビジネスコースを紹介いたします。
プログラミング入門ナビ編集部の現役のITエンジニアが、時間を掛けて各コースを選び抜きました！
価格は参考価格です。最新の価格情報など詳細はUdemyのサイトでご確認ください！！

Web開発入門

ウェブ開発入門完全攻略コース - HTML/CSS/JavaScript. プログラミングをはじめて学び創れる人へ！ウェブ開発入門完全攻略コース - HTML/CSS/JavaScript. プログラミングをはじめて学び創れる人へ！中村 祐太 Yuta Nakamura, Proglus （プログラス）Ruby on Rails7/MySQL/Bootstrap/AWS Cloud9/Git/GitHub等ウェブ開発に必要な様々なスキルを沢山学ぼう！カフェのウェブサイト、フォトギャラリー、ポートフォリオサイト、タスク管理アプリ等に挑戦！ 4.4 (7380 ratings)462 lectures, 28 hours

Vue.js入門

はじめてのVue.js 3 入門！jQuery を使わないウェブ開発 - 導入からアプリケーション開発まで体系的に学ぶはじめてのVue.js 3 入門！jQuery を使わないウェブ開発 - 導入からアプリケーション開発まで体系的に学ぶ中村 祐太 Yuta Nakamura, Proglus （プログラス）Angular.js、React.jsに比べて学習コストが低い注目度抜群のJavaScriptフレームワーク Vue.js！高度化するWeb開発のフロントエンド開発の課題を解決。 4.3 (3612 ratings)122 lectures, 5 hours

Ruby on Rails 入門

Bestseller はじめてのRuby on Rails入門-RubyとRailsを基礎から学びウェブアプリケーションをネットに公開しようはじめてのRuby on Rails入門-RubyとRailsを基礎から学びウェブアプリケーションをネットに公開しよう中村 祐太 Yuta Nakamura, Proglus （プログラス）Rails7対応。汎用性が高くPythonやPHPと同様に人気のある Rubyを使ってWebアプリケーション開発に挑戦しよう。基礎からAWSでの開発環境構築、Renderを使ってインターネットに公開するまでを体系的に学べる 4.4 (1878 ratings)157 lectures, 9 hours

React.js入門

フロントエンドエンジニアのための React アプリケーション開発入門 2018年版フロントエンドエンジニアのための React アプリケーション開発入門 2018年版はむさんのオンラインスクール 石田 敦志, シニアソフトウェアエンジニア、プログラミング講師RESTful APIサーバと連携する実践的なCRUDアプリケーション開発手法を学び、今後のフロントエンドWeb開発の標準になり得るReact・Reduxアプリケーション開発をマスターし、もう一段階上のJavsScriptエンジニアになろう 4.1 (1976 ratings)49 lectures, 7 hours
React + Redux を使用したモダンフロントエンド開発React + Redux を使用したモダンフロントエンド開発Nakanishi Yusuke, Front-end engineerReact + Redux + Redux-thunk + Ajax を用いた実践的なアプリケーションを作成します。React 開発を通して、ES2015+ や 非同期処理などモダンフロントエンド開発に必要な基礎知識も身につけられます。 3.7 (325 ratings)73 lectures, 6 hours

Linuxサーバー入門

Bestseller はじめてのLinuxサーバー構築運用入門 - Linuxコマンドを基礎から学ぶはじめてのLinuxサーバー構築運用入門 - Linuxコマンドを基礎から学ぶ中村 祐太 Yuta Nakamura, Proglus （プログラス）Linuxコマンド操作を基礎から学習してLAMPを構築できる. Linux, Apache MySQL(MariaDB), PHP, WordPressのインストールを実施. 4.3 (1780 ratings)99 lectures, 5 hours

Go入門

Bestseller 現役シリコンバレーエンジニアが教えるGo入門 + 応用でビットコインのシストレFintechアプリの開発現役シリコンバレーエンジニアが教えるGo入門 + 応用でビットコインのシストレFintechアプリの開発酒井 潤 (Jun Sakai), アメリカ シリコンバレー現役エンジニア、東アジア競技大会 金メダリスト サッカー選手現役シリコンバレーエンジニアの15時間のGo講座 〜 シリコンバレーで流行り出したGoを入門から習得し、応用で次世代Fintechアプリを開発する。Bitcoin以外の株やFXにも使えるシステムトレーディング分析方法を教授。 4.6 (2759 ratings)140 lectures, 15 hours

Python入門

Bestseller 現役シリコンバレーエンジニアが教えるPython 3 入門 + 応用 +アメリカのシリコンバレー流コードスタイル現役シリコンバレーエンジニアが教えるPython 3 入門 + 応用 +アメリカのシリコンバレー流コードスタイル酒井 潤 (Jun Sakai), アメリカ シリコンバレー現役エンジニア、東アジア競技大会 金メダリスト サッカー選手現役シリコンバレーエンジニアが教えるPython入門！応用では、データ解析、データーベース、ネットワーク、暗号化、並列化、テスト、インフラ自動化、キューイングシステム、非同期処理など盛り沢山の内容です！ 4.4 (23581 ratings)291 lectures, 29 hours
プログラミング初心者でも安心、Python/Django入門講座プログラミング初心者でも安心、Python/Django入門講座滝澤 成人, Pythonプログラマー初心者にオススメなプログラミング言語「Python」と、便利なWebアプリケーションフレームワーク「Django」でWebアプリケーションの作成方法を学ぼう! 4.1 (2512 ratings)112 lectures, 17 hours
社会人のためのPython活用術社会人のためのPython活用術大内 雅晴, 数学、統計およびデータ分析を社会人向けに教えていますPythonとJupyter notebookによってオフィスワーク改革を推進します。プログラミング未経験の初心者でも大丈夫です。ExcelおよびVBによるオフィス・レガシーから脱却します。データサイエンス時代の業務改革です。 4 (644 ratings)62 lectures, 9 hours
はじめてのPython 少しずつ丁寧に学ぶプログラミング言語Python3のエッセンスはじめてのPython 少しずつ丁寧に学ぶプログラミング言語Python3のエッセンス我妻 幸長 Yukinaga Azuma, Tateshi YaeoAIやデータサイエンスの講座でPythonが難しかった方は、この講座から始めましょう。今最も熱いプログラミング言語Pythonを学ぶことで、あなたの可能性は大きく広がります。プログラミング入門用の教材としてもおすすめです。 4.2 (5113 ratings)73 lectures, 4 hours

アプリ開発

Course not found.

Java知識ゼロOK！プロのAndroid開発者になるためのマスターコースJava知識ゼロOK！プロのAndroid開発者になるためのマスターコース金田浩明 (Hiroaki Kaneda), Android、iOSエンジニア【最新Android Studio 3に対応！】分かりやすく丁寧に解説！豊富なサンプルを通して、Javaの基礎・Android技術者として必要な知識・リストビュー・データベースの作成・魅力的なデザインをマスターしよう！ 4.1 (550 ratings)107 lectures, 10 hours

3Dゲーム制作入門

Bestseller 作って覚えるアンリアルエンジン【Unreal Engine 4】～ダンジョンゲーム編～作って覚えるアンリアルエンジン【Unreal Engine 4】～ダンジョンゲーム編～daibond （井上大輔）, Unreal Engine EvangelistこのコースはUnreal Engine 4（UE4）を使って、ゼロからゲームを作ります。 ちょっとかわいい（？）アワード博士があやしい地下遺跡を探索するダンジョンゲームを作りながら ゲーム制作の流れを学んでいきましょう！ 4.6 (2705 ratings)81 lectures, 18 hours
はじめてのアンリアルエンジン【Unreal Engine 4】入門チュートリアル講座はじめてのアンリアルエンジン【Unreal Engine 4】入門チュートリアル講座alwei (中村 匡彦), Unreal EngineゲームデベロッパーUnreal Engine 4の基本を一気に知りたいアナタにオススメ！このコースは、多くの商業ゲーム開発に利用されているUE4を基礎から8時間程度で学べる初心者向けのコースです。このコースで最新のゲーム開発に触れてみましょう！ 4.3 (1854 ratings)33 lectures, 8 hours

AI・機械学習入門

Bestseller 現役シリコンバレーエンジニアが教えるPython 3 入門 + 応用 +アメリカのシリコンバレー流コードスタイル現役シリコンバレーエンジニアが教えるPython 3 入門 + 応用 +アメリカのシリコンバレー流コードスタイル酒井 潤 (Jun Sakai), アメリカ シリコンバレー現役エンジニア、東アジア競技大会 金メダリスト サッカー選手現役シリコンバレーエンジニアが教えるPython入門！応用では、データ解析、データーベース、ネットワーク、暗号化、並列化、テスト、インフラ自動化、キューイングシステム、非同期処理など盛り沢山の内容です！ 4.4 (23581 ratings)291 lectures, 29 hours
【キカガク流】人工知能・機械学習 脱ブラックボックス講座 - 初級編 -【キカガク流】人工知能・機械学習 脱ブラックボックス講座 - 初級編 -吉崎 亮介, 株式会社 キカガク1000人以上が受講している（株）キカガクの『脱ブラックボックスセミナー』が遂に登場！機械学習の参考書を「閉じてしまった人」への再入門に最適な講座です。微分・線形代数といった数学の基礎からPythonでの実装まで短時間で習得しましょう。 4.3 (16758 ratings)25 lectures, 4 hours
みんなのディープラーニング講座 ゼロからPythonとColabで丁寧に学ぶ深層学習の最初の一歩【2021年最新版】みんなのディープラーニング講座 ゼロからPythonとColabで丁寧に学ぶ深層学習の最初の一歩【2021年最新版】我妻 幸長 Yukinaga Azuma, 人工知能（AI） / 生成AI / ディープラーニング / 機械学習初心者向けディープラーニングのコースです。Google ColaboratoryとPythonを使って、深層学習の基礎を習得しましょう。フレームワークを使わずに、ディープラーニングにおいて最初に学ぶべき原理を少しずつ着実に身につけます。 4 (696 ratings)34 lectures, 5 hours
【画像判定AIアプリ開発・パート1】TensorFlow・Python・Flaskで作る画像判定AIアプリ開発入門【画像判定AIアプリ開発・パート1】TensorFlow・Python・Flaskで作る画像判定AIアプリ開発入門井上 博樹 (Hiroki Inoue), AI開発, スタートアップ, Udemy講師Python 3 でクローリングして画像データを収集、加工し、画像分類器を作ってみよう。ディープラーニングによるモデル作成、改善を自分の集めたデータで実践します。Flaskでウェブアプリ化, XcodeでiOSアプリ化にも挑戦します。 3.8 (2528 ratings)67 lectures, 4 hours

Course not found.

【キカガク流】人工知能・機械学習 脱ブラックボックス講座 - 中級編 -【キカガク流】人工知能・機械学習 脱ブラックボックス講座 - 中級編 -吉崎 亮介, 株式会社 キカガク日本語トップコースである【キカガク流】脱ブラックボックス講座の中級編が遂に登場！「キカガクの知識は現場で使える！」そんな講座を目指しました。微分・線形代数といった数学の基礎からPythonでの実装まで短時間で習得しましょう。 4.4 (6787 ratings)34 lectures, 4 hours
【キカガク流】プログラミング力向上のためのPythonで学ぶアルゴリズム論（前編）【キカガク流】プログラミング力向上のためのPythonで学ぶアルゴリズム論（前編）吉崎 亮介, 株式会社 キカガク​​日本語トップコースである【キカガク流】脱ブラックボックス講座の講師が教えるアルゴリズム論が登場！写経では理解できるようになってきたけれど、自分で考えて組む自信はないという方向けに、プログラミング力が圧倒的に向上できる内容です。 4 (1575 ratings)17 lectures, 4 hours
Bestseller みんなのAI講座 ゼロからPythonで学ぶ人工知能と機械学習 【2024年最新版】みんなのAI講座 ゼロからPythonで学ぶ人工知能と機械学習 【2024年最新版】我妻 幸長 Yukinaga Azuma, 人工知能（AI） / 生成AI / ディープラーニング / 機械学習【Google Colaboratory対応】初心者向けの人工知能と機械学習のコースです。プログラミング言語Pythonを使って、機械学習とプログラミングの基礎、必要な数学を勉強しましょう！文字認識や株価分析なども行います。 4.2 (14460 ratings)65 lectures, 9 hours

データ分析

Bestseller はじめてのSQL ・データ分析入門 -データベースのデータをビジネスパーソンが現場で活用するためのSQL初心者向コースはじめてのSQL ・データ分析入門 -データベースのデータをビジネスパーソンが現場で活用するためのSQL初心者向コース中村 祐太 Yuta Nakamura, Proglus （プログラス）MySQL 使用。エクセル作業からのステップアップ！データベースのデータを取得し、効果的にレポーティングしたいビジネスパーソンにおすすめ！データベースを操作する言語SQLを短期間で身につけビジネスの現場で使うための実践型カリキュラム。 4.3 (6628 ratings)144 lectures, 7 hours
Bestseller 【ゼロから始めるデータ分析】 ビジネスケースで学ぶPythonデータサイエンス入門【ゼロから始めるデータ分析】 ビジネスケースで学ぶPythonデータサイエンス入門株式会社SIGNATE （旧株式会社オプトワークス）, Tomoki Takada（高田朋貴）分析コンペティションに参加しながら回帰分析による売上予測、機械学習での顧客ターゲティングなど実践的なビジネス課題でデータ分析の一連の流れを身に着けよう。 プログラミング初心者にもおすすめ。 4.2 (5612 ratings)121 lectures, 8 hours

Course not found.

Bestseller Rではじめる統計基礎講座Rではじめる統計基礎講座寺田 清昭, ディジタル信号処理、音響工学、通信工学R言語を使って、「データ分析」や「データサイエンス」の基礎を覚えて、ビジネスで活きる「実践的な統計」を学びましょう 4.3 (4035 ratings)34 lectures, 6 hours
Bestseller 医師が教えるR言語での医療データ分析入門‐改訂版（2022年）医師が教えるR言語での医療データ分析入門‐改訂版（2022年）Norimitsu Nishida, 産業医学　データサイエンスR言語でのデータ分析の基礎、インポート、クリーニング​、​可視化​、レポート作成を丁寧に解説！重回帰分析、ロジスティック回帰分析、一般化線形モデルの基礎から優しく解説。R言語に入門したいすべての人に向けたコース。 4.3 (932 ratings)282 lectures, 18 hours
【2023年5月改訂版】実践 Python データサイエンス【2023年5月改訂版】実践 Python データサイエンスShingo Tsuji, Pierian Data International by Jose Portilla, Pierian Trainingデータ解析の基本、可視化、統計、機械学習などデータサイエンスに関するあらゆる実践的なスキルがPythonで身に付く！ 3.9 (7878 ratings)104 lectures, 18 hours
【PythonとStanで学ぶ】仕組みが分かるベイズ統計学入門【PythonとStanで学ぶ】仕組みが分かるベイズ統計学入門Tetsuya T, データサイエンス/機械学習・深層学習/ベイズ統計/科学技術計算確率の基礎から出発し、ベイズ統計学の基礎およびMCMCの原理を学びます。概念の理解とPythonでのプログラミングへの実装を合わせる事で、動かしながら原理を理解できます 4 (1477 ratings)68 lectures, 11 hours

ビジネススキル

プレゼン

感情を動かす！社外プレゼンの資料作成術感情を動かす！社外プレゼンの資料作成術前田 鎌利, 書家・プレゼンテーションクリエイター取引先への提案が伝わらない、営業成績が上がらない…そんなお悩みはありませんか？ ソフトバンクの孫正義氏が認めたプレゼン術を、ベストセラー「社外プレゼンの資料作成術」の著者、前田鎌利がお届け。３時間であなたの「社外プレゼン」が見違えます。 4.2 (8457 ratings)32 lectures, 3 hours

エクセル入門

Bestseller 【 初心者から財務プロまで 】エクセルで学ぶビジネス・シミュレーション講座 マスターコース【 初心者から財務プロまで 】エクセルで学ぶビジネス・シミュレーション講座 マスターコース熊野 整, ChatGPT, Excel, マーケティング、データ分析、プレゼン、論理思考、Microsoft Officeエクセルを活用して、様々なシミュレーションができる財務モデルを作成し、ビジネスの意思決定力を高めます。「見やすく・ミスなく・速く」エクセルを使いながら成果を最大化する、外資系投資銀行流のビジネス・シミュレーション術を身につけましょう 4.4 (5192 ratings)68 lectures, 7 hours
【パソコン三種の神器】Word＋Excel＋PowerPointを10日間でイッキに速習 / エクセル兄さん講座【パソコン三種の神器】Word＋Excel＋PowerPointを10日間でイッキに速習 / エクセル兄さん講座エクセル兄さん たてばやし淳, ExcelとVBA書籍の著者「そろそろワード,エクセル,パワポくらいは使えるようになっておきたい」というあなたも、動画を見ながらマネするだけで短期間で速習できます。2万人以上が受講した「エクセル兄さん」講座。 4.2 (4423 ratings)95 lectures, 13 hours
Bestseller Excel中級者への150分【ピボット・VLOOKUP・条件付き書式・グラフ応用】Excel中級者への150分【ピボット・VLOOKUP・条件付き書式・グラフ応用】エクセル兄さん たてばやし淳, ExcelとVBA書籍の著者「Excel中級レベルになりたいけれど何を勉強したらいいか分からない」という方に。初級者を抜け出すには必須のスキルとして頻繁に例に挙がる４スキル（ピボットテーブル、VLOOKUP関数など）を、事務処理の流れに沿って速習できる講座です。 4.1 (5242 ratings)29 lectures, 3 hours
Bestseller 【初心者から上級者まで】１日で学べるエクセルの教科書　マスターコース【初心者から上級者まで】１日で学べるエクセルの教科書　マスターコース熊野 整, ChatGPT, Excel, マーケティング、データ分析、プレゼン、論理思考、Microsoft Office大手総合商社をはじめ、多くの有名企業で採用されているExcel研修プログラムを一挙公開！データ集計や「見やすく、ミスなく、速く」Excelスキルを1日でマスター。講師は外資系投資銀行出身、Excel著書はAmazonランキング1位の熊野整 4.3 (29905 ratings)114 lectures, 9 hours
エクセルのマクロが3時間でわかる！ | 初心者のための講座エクセルのマクロが3時間でわかる！ | 初心者のための講座JIMOVE Yamaguchi, Excelのムダを省くコンサルタントエクセルのマクロについて、0からのスタートの方でも、基本の基本から学習できるようになっています。セクションは5つあり、セクション1から実際にマクロを作っていただきながら、3時間ちょっとで自分で簡単なマクロを作れるようになります。 4 (181 ratings)30 lectures, 3 hours
Bestseller 【財務プロを目指す】エクセルで学ぶ財務三表モデル × 財務戦略シミュレーション【財務プロを目指す】エクセルで学ぶ財務三表モデル × 財務戦略シミュレーション熊野 整, ChatGPT, Excel, マーケティング、データ分析、プレゼン、論理思考、Microsoft Office大手総合商社の研修で導入されている本格的な財務戦略コースです。外資系投資銀行の講師がPL, BS, CFモデル作成方法を教えます。 4.5 (3349 ratings)46 lectures, 5 hours
Excelエキスパート認定への道【MOS資格エキスパート試験対策オンライン講座】エクセル兄さんのスピードMOS合格コースExcelエキスパート認定への道【MOS資格エキスパート試験対策オンライン講座】エクセル兄さんのスピードMOS合格コースエクセル兄さん たてばやし淳, ExcelとVBA書籍の著者人気講座の上級編がついに登場！Excelでエキスパート資格相当のスキルを身につけ、事務で困ることが(ほぼ)無くなり、仕事のスピードがアップ／Microsoft認定資格「MOS」エキスパート試験対応／人気講師エクセル兄さんの資格対策講座の続編 4.5 (3228 ratings)175 lectures, 13 hours
Bestseller Excel VBA[第2弾](脱・入門編)請求書を1クリックで出力するマクロを作成！文系・非IT職もできるプログラミングExcel VBA[第2弾](脱・入門編)請求書を1クリックで出力するマクロを作成！文系・非IT職もできるプログラミングエクセル兄さん たてばやし淳, Ritz!(リッツ) プログラミング教室シリーズ延べ5万人が受講。マクロVBAをやさしく理解できる人気シリーズ待望の続編が登場！「エクセル仕事、時間がかかって終わらない…」と嘆くカフェの店主・マークに、謎のクマがマクロVBAを伝授。今度のマクロは請求書を1ボタンで自動作成する？ 4.6 (5922 ratings)89 lectures, 7 hours

動画でプログラミング入門をしよう

オンライン学習サービスProglus（プログラス）でプログラミングを学び、創れる人になろう！

プレミアムプランを2週間無料体験しよう

今すぐ詳細を確認する

Vue.jsの読み込み方法について

By

この記事ではVue.jsの読み込みについて学習します。

オンライン講座「Vue JS入門決定版！jQueryを使わないWeb開発 – 導入からアプリケーション開発まで体系的に動画で学ぶ」を、世界最大級のオンライン学習プラットフォームUdemy（ユーデミー）で公開中です。

Vue.jsを使ってプログラムを書くには、Vue.jsのファイルを読み込む必要があります。

Vue.jsを読み込む方法

Vue.jsを読み込む方法ですが、主に、次の方法があります。

  • ◯ CDN（Content Delivery Network経由 ）
  • 直接組み込み（ファイルをダウンロードして配置）
  • NPM（パッケージ管理ソフトの利用）

この記事では原則CDNを使った読み込みを行います。無料で利用できます。

動画で学習する

CDNについて

CDNというのはContent Delivery Network の略です。
ウェブコンテンツをインターネット経由で配信するために最適化されたネットワークのことです。

Vue.jsで利用するのはjsdelivrというCDNですが、東京と大阪にもエッジロケーション、つまり、配信サーバがあるので高速です。

Network map | jsDelivr

基本的には、何かしらの理由がある時以外は、CDNを使うのがおすすめです。

読み込み方ですが。
Vue.jsの公式サイトで、「インストール」 などのキワードで検索すると、
インストールのページが開けます。

見出しCDN, のところに、vue.jsをCDNから読み込むための、コードが記載されているのでコピーします。

HTML入力欄の末尾にコピーしまします。
実際のHTMLの場合は、bodyの終了タグの直前に配置します。

これでVue.jsを読み込むことができました。

Vue.jsのバージョンについて

この数字を変更することで,読み込むvue.jsのバージョンを変更することができます。

このコースのサンプルコードは、vue.js バージョン2.5.16で動作確認を行っています。

2.5.xというバージョンで、かつ、2.5.16以上であれば基本的には動作すると考えられます。

しかしながら、2.5.16以外のバージョンですと、動作が動画と異なる可能性もあるため、学習中には、バージョン2.5.16を明示的に指定することをおすすめします。

実際に本番環境で一般ユーザーに公開する場合も、バージョンを固定するのが安全です。
Vue.jsのバージョンを上げるときには、必ず、ステージング環境など開発用の環境で、新しいVue.jsのバージョンでアプリケーションの動作検証をしてから、本番環境に公開するようにしてください。

おわりに

このレクチャーでは、Vue.jsをCDNを使った読み込む方法について学習しました。
オンライン講座「Vue JS入門決定版！jQueryを使わないWeb開発 – 導入からアプリケーション開発まで体系的に動画で学ぶ」では、Vue.jsを動画を使って学習します。
Vue.jsを使ったWeb開発に興味はあるけれど、まだ触れていない方におすすめです。
動画教材を使うことで、独学するよりも効率的に学べます。

はじめてのVue.js 3 入門！jQuery を使わないウェブ開発 - 導入からアプリケーション開発まで体系的に学ぶはじめてのVue.js 3 入門！jQuery を使わないウェブ開発 - 導入からアプリケーション開発まで体系的に学ぶ中村 祐太 Yuta Nakamura, Proglus （プログラス）Angular.js、React.jsに比べて学習コストが低い注目度抜群のJavaScriptフレームワーク Vue.js！高度化するWeb開発のフロントエンド開発の課題を解決。 4.3 (3612 ratings)122 lectures, 5 hours

動画でプログラミング入門をしよう

オンライン学習サービスProglus（プログラス）でプログラミングを学び、創れる人になろう！

プレミアムプランを2週間無料体験しよう

今すぐ詳細を確認する

JSFiddleの画面の概要について説明

By

この記事では、jsFiddleの画面の概要について、学習します。

オンライン講座「Vue JS入門決定版！jQueryを使わないWeb開発 – 導入からアプリケーション開発まで体系的に動画で学ぶ」を、世界最大級のオンライン学習プラットフォームUdemy（ユーデミー）で公開中です。

jsFiddleのサイトをWebブラウザで開く

Webブラウザでjsfiddle.netを開いてください。
Webブラウザは、本質的ではない部分でトラブルが発生しないために、Google Chromeを使うことをおすすめしています。

動画で学ぶ

初期操作

JSFiddleを開いたら、
Closeを押して、作業領域を広くします。

いまは、黒い画面、Darkテーマになっているのですが、
動画で皆さんが見やすいように、明るいテーマに変更をしておきます。
Settings > Dark テーマ をOFFにしします。
テーマは、各自の好みで構いません。

HTML 入力欄について

このHTMLと記載がある入力欄には、Vue.jsのテンプレート記述します。

もう少し補足すると、
ここには、HTMLのbodyタグの要素の内容を記述します。
HTMLタグとか、ヘッダーなどは、JSfiddleが、自動的に生成するので書く必要はありません、

<!-- この部分を記述する -->

JavaScript入力欄

JavaScriptの欄には、JavaScriptを記載します。
jsファイルの読み込みに相当する記述は、JSFiddleが自動的に裏側で記述してくれます。

CSS入力欄

JavaScriptの欄には、CSSを記載します。
CSSファイルの読み込みに相当する記述は、JSFiddleが自動的に裏側で記述してくれます。

出力欄

この部分には、
書いたコードの出力が表示されます。

RUNボタン押すと、書いたコードが描画されます。

デベロッパーツールで、HTMLを確認してみましょう。
iframeで、開発者が書いたWebページを表示していることが分かります。

おわりに

もう少し詳しい使い方や、便利な使い方については、あとのレクチャーで随時紹介していきます。

実際に使ってみたほうがイメージしてが着くと思いますので、つぎのレクチャーから、実際にはコードを書いてきましょう。

この記事では、このレクチャーでは、JSFiddleの画面について概要を学習しました。

はじめてのVue.js 3 入門！jQuery を使わないウェブ開発 - 導入からアプリケーション開発まで体系的に学ぶはじめてのVue.js 3 入門！jQuery を使わないウェブ開発 - 導入からアプリケーション開発まで体系的に学ぶ中村 祐太 Yuta Nakamura, Proglus （プログラス）Angular.js、React.jsに比べて学習コストが低い注目度抜群のJavaScriptフレームワーク Vue.js！高度化するWeb開発のフロントエンド開発の課題を解決。 4.3 (3612 ratings)122 lectures, 5 hours

動画でプログラミング入門をしよう

オンライン学習サービスProglus（プログラス）でプログラミングを学び、創れる人になろう！

プレミアムプランを2週間無料体験しよう

今すぐ詳細を確認する

Vue.jsの基本的な使い方 イントロダクション

By

注目度抜群のJavaScriptフレームワーク「Vue.js」入門オンラインコース『「Vue JS入門決定版！jQueryを使わないWeb開発 – 導入からアプリケーション開発まで体系的に動画で学ぶ」』 Vuejsの基本的な使い方のセクションのイントロダクションです。

オンライン講座「Vue JS入門決定版！jQueryを使わないWeb開発 – 導入からアプリケーション開発まで体系的に動画で学ぶ」を、世界最大級のオンライン学習プラットフォームUdemy（ユーデミー）で公開中です。

Vue.jsを動画で学ぶ

説明

このセクションでは、Vue.jsの基本的な使い方について、速習を行います。

機能の詳細については、あとのセクションで個別に説明します。
まずは、細かいことよりも、Vue.jsの全体像についてコードを書いて習得することを目的としています。

学習環境としては、JavaScriptの学習に便利なWebサービス jsFiddleを利用します。
無料で使えて、ユーザー登録も必須ではありません。

jsFiddleを使わないで、テキストエディタを使って開発する方法についても、補足説明いたします。

このセクションの学習カリキュラム

  1. イントロダクション
  2. JSFiddle 画面説明
  3. Vue.jsの読み込み
  4. Vue.jsの開発バージョンと本番バージョン
  5. Vueインスタンスの作成
  6. ルートのテンプレートを作成
  7. データバインディングとは
  8. Vue.js入門 テキストのデータバインディング
  9. dataオプションにオブジェクトや配列要素を設定
  10. jsFiddle 便利な設定
  11. jsFiddle ソースコードの保存
  12. エラーを自力で解決する方法
  13. ディレクティブとは
  14. 属性のデータバインディング v-bind
  15. 条件分岐 v-if
  16. 条件分岐 v-show
  17. 繰り返しの描画 v-for
  18. オブジェクトの繰り返し描画 v-for
  19. イベントの基本 v-on
  20. 双方向データバインディング v-model
  21. コンポーネント
  22. トランジション
  23. 演習：Vue.jsの基本的な使い方のまとめ①
  24. 演習：Vue.jsの基本的な使い方のまとめ②
  25. 補足：テキストエディタを使った開発
  26. consoleからObj操作

おわりに

Vue.jsのコードは書いていて、とても楽しいです。

この楽しさは理屈では説明が難しいので、まずはコードを書いて体感してください。

詳細は無料プレビュー動画を30分用意しましたので、ぜひご覧ください！

はじめてのVue.js 3 入門！jQuery を使わないウェブ開発 - 導入からアプリケーション開発まで体系的に学ぶはじめてのVue.js 3 入門！jQuery を使わないウェブ開発 - 導入からアプリケーション開発まで体系的に学ぶ中村 祐太 Yuta Nakamura, Proglus （プログラス）Angular.js、React.jsに比べて学習コストが低い注目度抜群のJavaScriptフレームワーク Vue.js！高度化するWeb開発のフロントエンド開発の課題を解決。 4.3 (3612 ratings)122 lectures, 5 hours

動画でプログラミング入門をしよう

オンライン学習サービスProglus（プログラス）でプログラミングを学び、創れる人になろう！

プレミアムプランを2週間無料体験しよう

今すぐ詳細を確認する

【JavaScript】変数の宣言var, const, let の違いについて

By

変数の宣言var, const, let の違いについて、プログラミング入門者向けに説明いたします。

主に、「動作の違い」、「利用できるJavaScriptのバージョンの違い」2点が挙げられます。

この記事は、オンラインプログラミング学習講座「Web開発入門完全攻略コース」サポート記事です。

① 動作の違い

var ・・・「再宣言」も「再代入」も可能

例)

var num = 10; // OK
num = 11; // OK
var num = 12; // OK

let・・・ 「再宣言」が不可

例)

let num = 10; // OK
num = 11; // OK
let num = 12; // NG

const ・・・ 「再宣言」も「再代入」も不可

例)

const num = 10; // OK
num = 11; // NG
const num = 12; // NG

②利用できるJavaScriptのバージョンの違い

  • var・・・すべてのJavaScriptバージョンで利用できる。

  • let, const ・・・ES2015以降で利用できる。インタネットエクスプローラーなど、対応していないブラウザがあるため、公開時にES5のコードに変換するなど配慮が必要になる場合がある。

おわりに

この記事では、変数の宣言var, const, let の違いについて、プログラミング入門者向けに説明しました。

Udemyでオンライン講座を公開中！

オンライン講座「Web開発入門完全攻略コース」では、JavaScriptの使い方を始めとした、プログラミング入門について動画を使って学習できます。
無料プレビューを1時間分用意しています。ぜひご確認ください！

動画でプログラミング入門をしよう

オンライン学習サービスProglus（プログラス）でプログラミングを学び、創れる人になろう！

プレミアムプランを2週間無料体験しよう

今すぐ詳細を確認する