Udemy
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
Development
Web Development Data Science Mobile Development Programming Languages Game Development Database Design & Development Software Testing Software Engineering Development Tools No-Code Development
Business
Entrepreneurship Communications Management Sales Business Strategy Operations Project Management Business Law Business Analytics & Intelligence Human Resources Industry E-Commerce Media Real Estate Other Business
Finance & Accounting
Accounting & Bookkeeping Compliance Cryptocurrency & Blockchain Economics Finance Finance Cert & Exam Prep Financial Modeling & Analysis Investing & Trading Money Management Tools Taxes Other Finance & Accounting
IT & Software
IT Certification Network & Security Hardware Operating Systems Other IT & Software
Office Productivity
Microsoft Apple Google SAP Oracle Other Office Productivity
Personal Development
Personal Transformation Personal Productivity Leadership Career Development Parenting & Relationships Happiness Esoteric Practices Religion & Spirituality Personal Brand Building Creativity Influence Self Esteem & Confidence Stress Management Memory & Study Skills Motivation Other Personal Development
Design
Web Design Graphic Design & Illustration Design Tools User Experience Design Game Design Design Thinking 3D & Animation Fashion Design Architectural Design Interior Design Other Design
Marketing
Digital Marketing Search Engine Optimization Social Media Marketing Branding Marketing Fundamentals Marketing Analytics & Automation Public Relations Advertising Video & Mobile Marketing Content Marketing Growth Hacking Affiliate Marketing Product Marketing Other Marketing
Lifestyle
Arts & Crafts Beauty & Makeup Esoteric Practices Food & Beverage Gaming Home Improvement Pet Care & Training Travel Other Lifestyle
Photography & Video
Digital Photography Photography Portrait Photography Photography Tools Commercial Photography Video Design Other Photography & Video
Health & Fitness
Fitness General Health Sports Nutrition Yoga Mental Health Dieting Self Defense Safety & First Aid Dance Meditation Other Health & Fitness
Music
Instruments Music Production Music Fundamentals Vocal Music Techniques Music Software Other Music
Teaching & Academics
Engineering Humanities Math Science Online Education Social Science Language Teacher Training Test Prep Other Teaching & Academics
AWS Certification Microsoft Certification AWS Certified Solutions Architect - Associate AWS Certified Cloud Practitioner CompTIA A+ Cisco CCNA Amazon AWS CompTIA Security+ AWS Certified Developer - Associate
Graphic Design Photoshop Adobe Illustrator Drawing Digital Painting InDesign Character Design Canva Figure Drawing
Life Coach Training Neuro-Linguistic Programming Personal Development Mindfulness Personal Transformation Meditation Life Purpose Coaching Neuroscience
Web Development JavaScript React CSS Angular PHP WordPress Node.Js Python
Google Flutter Android Development iOS Development Swift React Native Dart Programming Language Mobile Development Kotlin SwiftUI
Digital Marketing Google Ads (Adwords) Social Media Marketing Google Ads (AdWords) Certification Marketing Strategy Internet Marketing YouTube Marketing Email Marketing Retargeting
SQL Microsoft Power BI Tableau Business Analysis Business Intelligence MySQL Data Analysis Data Modeling Big Data
Business Fundamentals Entrepreneurship Fundamentals Business Strategy Online Business Business Plan Startup Freelancing Blogging Home Business
Unity Game Development Fundamentals Unreal Engine C# 3D Game Development C++ 2D Game Development Unreal Engine Blueprints Blender
30-Day Money-Back Guarantee

This course includes:

  • 6.5 hours on-demand video
  • 8 articles
  • Full lifetime access
  • Access on mobile and TV
Development Web Development React

最短で学ぶReactとReduxの基礎から実践まで

近年急速にJavaScript開発のスタンダードとなりつつあるReact.jsとReduxをゼロからコードを書きながら学びます。基本的な考え方から実用に耐え得るリファクタリングまでカバーしているので、すぐにでも実践で使えるようになります。
Rating: 3.7 out of 53.7 (526 ratings)
2,842 students
Created by 佑介 村田, AIトラベル 株式会社
Last updated 5/2020
Japanese
30-Day Money-Back Guarantee

What you'll learn

  • React・Reduxの基礎が理解できるようになります
  • 実践的なコードの書き方やリファクタリング方法が身につきます
  • React・Reduxでより大規模なアプリケーションを構築できるようになります

Course content

6 sections • 49 lectures • 6h 34m total length

  • Preview03:55
  • 完成版のソースコード
    00:13
  • 講座内で利用するエイリアスコマンド
    00:34
  • エディタのインストール(atom)とプロジェクトの作成
    02:42
  • パッケージマネージャー(yarn)のインストール
    01:04
  • yarnでインストールするパッケージのバージョンについて
    01:20
  • ES2015に必要なパッケージのインストール(bable・webpack)
    04:41
  • 次のレクチャーで利用するソースコード
    00:42
  • ES2015でのHello world
    07:40
  • [ご確認ください] eslintの実行ファイルが消えるエラーについて
    00:32
  • 静的解析ツール(eslint)の導入
    07:10
  • 次のレクチャーで利用するソースコード
    01:24
  • sass/scssを用いたスタイルシートの導入
    05:11
  • [ご確認ください] reactとreact-domのバージョンについて
    00:33
  • Preview05:02

  • Preview06:19
  • propsを用いたcomponent間の情報伝達
    06:12
  • stateを用いてcomponentに状態を持たせる
    06:40
  • ユーザーの入力情報を取得する
    08:01

  • 緯度経度検索サービスの概要と設計
    02:37
  • jsxファイル上でのタグの自動補完
    00:20
  • SearchFormコンポーネントの実装
    13:09
  • GeocodeResultコンポーネントの実装
    06:20
  • APIから緯度経度を取得する
    13:06
  • Google Mapの導入
    18:39
  • componentからロジックを逃がすリファクタリング
    16:00
  • ホテル検索機能の概要と設計
    13:30
  • ホテル検索機能のコンポーネント実装とバーチャルDOMの仕組みの解説
    14:59
  • 2つのAPIの連結
    19:16
  • 表示する情報の追加
    13:24
  • ソート機能の作成
    19:39
  • componentのライフサイクル
    06:13

  • 作成するページの概要
    01:14
  • SearchPageの切り出しと左ナビの追加
    07:06
  • React RouterのインストールとAboutページの作成
    09:14
  • React Routerの仕組み
    04:40
  • history.pushでgetパラメータをつける
    04:21
  • getパラメータをアプリ内で利用する
    17:37

  • Flux・Reduxの概要
    07:39
  • ReduxでのHello World
    17:23
  • Presentational ComponentとContainer Componentの振り分け
    10:23
  • Providerとconnect()を使って記述を簡略化する
    15:41
  • redux-devtoolsのインストール
    06:23
  • Reducerの分割とAjaxからのdispatch
    16:16
  • Action Creatorの分割
    12:26
  • Middlewareとthunkの解説
    08:46
  • ホテル一覧部分のRedux化
    14:58
  • React Routerの復活
    07:38

  • 今後の学習に向けて
    05:11

Requirements

  • HTML/CSSの基礎知識
  • JavaScriptの基本的な構文理解
  • UNIXコマンドの基礎知識

Description

JavaScriptを使ったリッチなWEBアプリケーションが増えるにつれて、千差万別なjQueryでの状態管理はメンテナンスの非常に難しいプロジェクトを量産しました。

そんな中で状態と表示の関係を宣言的に記述できるReact.jsは、大規模化するフロントエンドで保守性の高いコードを書くための強力なツールとして瞬く間に広まりました。

この講座は、ベンチャーのCTOとして2年前からReact.jsで自社サービスを開発している経験を元に、React.jsを基礎から学び、状態管理のライブラリであるReduxと共に現場で活躍できるレベルでの習得を目指して作られています。

サンプルを動かすだけではなく、どういう発想でコンポーネントを作成していくか、どういったトレードオフが発生するか、どこまでリファクタリングするかなど、実際に開発チームに教えていることも交えながらレクチャーを進めていきます。

React.jsでの手続き型から宣言型への発想の転換、Reduxの関数型プログラミングの考え方などはJavaScriptに限らずプログラミングのあらゆるレイヤーに応用できる思考法なので、ぜひそのエッセンスも一緒に学び取っていただければ幸いです。

Who this course is for:

  • Reactで実践的なWEBアプリケーションを作れるようになりたい方
  • jQueryでの開発に限界を感じている方

Instructors

佑介 村田
Ruby, React, Swift
佑介 村田
  • 3.7 Instructor Rating
  • 526 Reviews
  • 2,842 Students
  • 1 Course

株式会社AIトラベルでCEOを務めています。

京都大学経済学部を卒業後、新卒で楽天株式会社に入社。1年間新卒採用を経験した後、希望してエンジニアに転身。3年間開発を経験した後に起業。

楽天時代から多数の言語・フレームワークが混在するチームで技術を磨き、現在はRuby on RailsとReactを主に使っています。

インフラからフロントまでもりもり開発中です。

AIトラベル 株式会社
プログラミング
AIトラベル 株式会社
  • 3.7 Instructor Rating
  • 526 Reviews
  • 2,842 Students
  • 1 Course

出張などの法人の移動を最適化するSaaSサービスを開発・運営している会社です。代表の村田は個人でも「最短で学ぶReactとReduxの基礎から実践まで」というUdemyの講座を開講しており、プログラミング以外にも内部統制や会計・経理などのスペシャリティを持った講師陣を有しています。

  • Udemy for Business
  • Teach on Udemy
  • Get the app
  • About us
  • Contact us
  • Careers
  • Blog
  • Help and Support
  • Affiliate
  • Terms
  • Privacy policy
  • Cookie settings
  • Sitemap
  • Featured courses
Udemy
© 2021 Udemy, Inc.