原文发表于我的技术博客

我在慕课网的「React.js 入门与实战之开发适配PC端及移动端新闻头条平台」课程已经上线了，文章中是目前整个课程的大纲，以后此课程还会保持持续更新，此大纲文档也会保持更新，备查。
原文发表于我的技术博客

1. 课程简介

在此 React 入门与实战课程中，主要使用的课程结构是 React 基本概念与实战结合。课程从 React 的简介讲起，在正式开始学习 React 前将对目前火热的前端知识点进行了梳理，包括基础的 JS、ES5 / ES6、CSS、HTML5，也包含了NodeJS的简介与安装、开发环境热加载组件 webpack 的简介安装与配置，甚至包括前端开发工具Atom 及其相关插件都进行了详细的介绍。这些知识也是前端开发最先进、必备的知识点，此课程种都进行了相关的介绍与实战演示。

课程地址：http://coding.imooc.com/class/83.html

2. 课程特色

  • 上手更直观：前期只需掌握JavaScript，HTML和CSS知识点，课程中手写每一行代码，在介绍了大量的前端知识以及 React 的基本知识后，接入一个比较大的实战项目进行技术演练 。

  • 紧跟前沿新技术：不仅仅介绍了 React 的知识，也从前端开发的层面给大家讲解了一些开发技巧以及后期的性能优化知识。

  • 基础与实战相结合：课程按照5分理论5分实战。在实战中大家更能加深对基础知识的理解。

  • 分集的源码提供：课程每一节课都有单独的源码打包提供，解决了小白同学对于环境以及糅合在一起的代码的困惑，课程里讲到那里，就有一个单独的源代码文件夹供同学下载学习，和课程完全一样。

  • 超级全面的思维导图：在课程的最后给同学们提供了一个超级大的思维导图，所有的课程重点难点我们都记录在了这个思维导图中，我也相信这个文件将帮同学们很好地梳理好课程中的疑难点。在后续的QQ 群交流中我也将根据大家的学习反馈及时地更新这个非常有意义的思维导图。

3. 课程大纲

章节 01 课程介绍

  • 课程大纲与导读

章节 02 React 简介

  • React 简介课程
  • 前置知识点梳理

章节 03 React 初体验

  • 课程 React 版本选择
  • React Starter Pack 下载使用与 React 初体验

章节 04 NodeJS简介与安装

  • NodeJS 简介
  • NodeJS 安装
  • NPM 配置国内源

章节 05 React 环境配置与调试技巧

  • 使用 NPM 配置 React 开发环境
  • webpack 热加载配置（上）
  • webpack 热加载配置（中）
  • webpack 热加载配置（下）
  • Chrome React 插件使用

章节 06 开发工具与必要组件

  • 开发工具 Atom
  • React 开发相关 Atom 插件配置

章节 07 React 组件基础

  • React 虚拟 DOM 概念
  • React 组件
  • React 多组件嵌套
  • JSX 内置表达式
  • 生命周期

章节 08 React 属性与事件

  • State 属性
  • Props 属性
  • 事件与数据的双向绑定
  • 可复用组件
  • 组件的 Refs
  • 独立组件间共享 Mixins

章节 09 React 样式

  • 内联样式
  • 内联样式中的表达式
  • CSS 模块化
  • JSX 样式与 CSS 的互转
  • Ant Design 样式框架介绍
  • Ant Design 样式框架使用

章节 10 React Router

  • Router 概念
  • Router 参数传递

章节 11 项目实战之开发环境初始化

  • 项目初始化
  • Ant Design 框架的引入
  • 头条新闻的数据接口简介
  • 测试环境介绍

章节 12 项目实战之页头页脚模块

  • PC 端页头组件开发
  • 移动端页头组件开发
  • PC 端页脚组件开发
  • 移动端页脚组件开发

章节 13 项目实战之注册登录模块

  • PC 端注册功能模块开发（上中下）
  • 移动端注册功能模块开发
  • PC 端登录功能模块开发
  • 移动端登录功能模块开发
  • 退出登录功能完善

章节 14 项目实战之首页模块

  • PC 端导航栏布局开发
  • 移动端导航栏模块开发
  • 首页模块划分
  • PC 端首页模块布局开发（上）
  • PC 端首页模块布局开发（中）
  • PC 端首页模块布局开发（下）
  • 移动端首页模块布局开发（上）
  • 移动端首页模块布局开发（中）
  • 移动端首页模块布局开发（下）

章节 15 项目实战之详情模块

  • PC 端详情页面开发（上）
  • PC 端详情页面开发（中）
  • PC 端详情页面开发（下）
  • 移动端详情页面开发
  • 评论模块开发（上）
  • 评论模块开发（中）
  • 评论模块开发（下）
  • 移动端评论模块开发
  • PC 端用户收藏功能开发（上）
  • PC 端用户收藏功能开发（下）
  • 移动端用户收藏功能开发

章节 16 项目实战之个人中心模块

  • PC 端用户个人中心开发
  • 移动端用户个人中心开发
  • 个人头像的上传与处理
  • 个人收藏文章列表开发（上）
  • 个人收藏文章列表开发（下）
  • 个人评论列表开发（上）
  • 个人评论列表开发（下）

章节 17 项目实战之最后调优

  • 快速使用 HTML 代码块
  • 项目重要知识点回顾

章节 18 网页性能调优技巧

  • 网页优化军规介绍（上）
  • 网页优化军规介绍、插件（下）

章节 19 React 实用组件

  • 上拉刷新加载数据
  • 下拉刷新加载数据
  • Redux 简介与实例演示
  • 页面表单、图表、图标框架

4. 学习收获

  • 了解React 的发展、适用平台、基本概念
  • React 相关知识点的梳理
  • NodeJS 的概念、安装与国内源的配置
  • 使用 NPM 配置 React 项目
  • webpack 的概念、安装与配置
  • 开发工具 Atom 的安装与插件配置
  • 虚拟 DOM 的理解
  • React 的所有基本知识点
  • React 中的样式模块化
  • Ant Design 框架的熟练掌握
  • 网站的项目开发流程及技术要点
  • 快速地适配 PC 端与移动端
  • PC 端与移动端的开发快速调试
  • 网页性能优化技巧
  • 超级全面的 React 学习思维导图
  • 分集的源代码完整打包

React.js 入门与实战之开发适配PC端及移动端新闻头条平台课程上线了的更多相关文章

  1. React.js 入门与实战课程思维导图

    原文发表于我的技术博客 我在慕课网的「React.js 入门与实战之开发适配PC端及移动端新闻头条平台」课程已经上线了,在这里分享了课程中的思维导图,供大家参考. 原文发表于我的技术博客 此导图为课程 ...

  2. React.js入门笔记

    # React.js入门笔记 核心提示 这是本人学习react.js的第一篇入门笔记,估计也会是该系列涵盖内容最多的笔记,主要内容来自英文官方文档的快速上手部分和阮一峰博客教程.当然,还有我自己尝试的 ...

  3. React Native入门——布局实践：开发京东client首页（一）

    有了一些对React Native开发的简单了解,让我们从实战出发.一起来构建一个简单的京东client. 这个client是仿照之前版本号的京东client开发的Android版应用,来源于CSDN ...

  4. 前端框架React Js入门教程【精】

    现在最热门的前端框架有AngularJS.React.Bootstrap等.自从接触了ReactJS,ReactJs的虚拟DOM(Virtual DOM)和组件化的开发深深的吸引了我,下面来跟我一起领 ...

  5. React.js - 入门

    React.js - 第1天 1. React简介 React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设 ...

  6. React.js入门

    React 入门实例教程   现在最热门的前端框架,毫无疑问是 React . 上周,基于 React 的 React Native 发布,结果一天之内,就获得了 5000 颗星,受瞩目程度可见一斑. ...

  7. React.js入门必须知道的那些事

    首先,React.js是facebook在2013年5月开源的一个前端框架,React不是一个MVC框架,它是构建易于可重复调用的web组件,侧重于UI, 也就是view层, React为了更高超的性 ...

  8. 《React Native入门与实战》读书笔记（1）

    ReactNative介绍 它的底层引擎是JavaScript Core,调用的是原生组件而非HTML5组件(HTML+CSS+JavaScript构建的组件).运行时,可以做到与Native App ...

  9. React.js入门笔记(再续)：评论框的实现

    本案例来自React.js中文官网对应内容. 一. 运行环境 <link rel="stylesheet" type="text/css" href=&q ...

随机推荐

  1. 使用openssl在windows 10下本地xampp配置https开发环境

    安装win64OpenSSL-1_1_0j后重新启动:以管理员权限启动powershell; 执行以下命令 set OPENSSL_CONF=c:\xampp\apache\conf\openssl. ...

  2. [20170909]为什么是12秒.txt

    [20170909]为什么是12秒.txt --//在开发程序时我一般会强调开发尽量不要写一些自定义函数,往往可能导致CPU忙.--//例子很像这样: CREATE OR REPLACE FUNCTI ...

  3. nodejs在spawn中执行npm报错 [Error: spawn ENOENT]” errors

    描述: 上代码 var ps = require('child_process').spawn("npm", ['install'], { stdio: 'inherit', cw ...

  4. 【hexo】02完成本地创建

    获得一个github账号并创建repo,命名为yourname.github.io 搭桥到github 配置github账户信息(YourName和YourEail都替换成你自己的): 网站部署 $ ...

  5. apache的php模块讲解以及搭建phpmyadmin管理数据库mysql

    1.php php的包名字叫做php-common,其配置文件使用的是ini风格的格式. php的配置文件以分号作为注释,把分号去掉表示启动此片段功能. 在这里我们可以看到php在apache中的模块 ...

  6. <table>标签总结（colspan跨列 ，rowspan跨行）

    table标签有些内置属性要设置: <table cellpadding="0" cellspacing="0" border="0" ...

  7. Sublime Text的使用

    本文目录 1.下载安装Sublime Text 2.配置Python IDE环境 3.sublime anaconda载入出现错误 4.Sublime Text快捷键 1.下载安装Sublime Te ...

  8. 用Python读写Excel文件的方式比较

    虽然天天跟数据打交道,也频繁地使用Excel进行一些简单的数据处理和展示,但长期以来总是小心地避免用Python直接读写Excel文件.通常我都是把数据保存为以TAB分割的文本文件(TSV),再在Ex ...

  9. 如何用命令行刷新,启用,禁用Magento2的缓存

    当你使用Magento商店时如何刷新Magento 2中的Cache命令行是基本的常用操作.Magento 2默认有12种缓存类型.在命令行中有5个简单的命令来管理缓存.在这篇文章中,我将逐步向您展示 ...

  10. adb报错问题解决方法

    1,报错信息:adb server version (31) doesn't match this client (40); killing 解决方法: 一: 主要是前面的31或者其他,比如32/31 ...