这是本人初学React做的学习笔记;讲的不是很深,只算是简单的进行介绍。

这是一个小系列。都是在同一个模板中搭建的,但是代码是不能正常执行的。

>>index.js

  

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>React工程模板</title> <!-- react.js 是React的核心库 -->
<script src="./build/react.js charset="utf-8"></script>
<!-- react-dom.js是作用是提供与DOM相关的功能 -->
<script src="./build/react-dom.js" charset="utf-8"></script>
<!-- browser.min.js 的作用是将JSCX语法转换成Javascript的语法 -->
<script src="./build/browser.min.js" charset="utf-8"></script>
<!-- 还可以直接通过网址引入browser.min.js文件 -->
<!--比如: <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.min.js" charset="utf-8"></script> --> </head>
<body>
<!-- React渲染的模板内容会插入到这个DOM节点中,因此这里的<div>将作为一个容器 -->
<div id="container"> </div> <!-- 在React开发中,使用JSX语法,跟Javascript不兼容,所以在使用JSX语法的地方,要设置type:text/babel -->
<!-- 而babel是一个转换编译器,它能把ES6转成可以在浏览器中运行的代码 -->

<script type="text/babel"> <!-- 在此处编写React代码 --> </script> </body>
</html>

  

创建React工程:React工程模板的更多相关文章

  1. 创建React工程

    下载 main.jsBundle 包curl http://localhost:8081/index.ios.bundle -o main.jsbundle <!DOCTYPE html> ...

  2. 如何创建一个前端 React 组件并发布到 NPM

    首先npm文档摆在这里: https://www.npmjs.cn/ 参考组件 https://github.com/rakuten-rex/rex-dropdownhttps://www.npmjs ...

  3. react 工程起步 安装chrome 开发调试工具 react developer tools 及初建一个react 项目...

    1.安装react 开发工具 1.下载    chrome      react developer tools 下载地址:https://pan.baidu.com/s/1eSZsXDC  下载好是 ...

  4. 重谈react优势——react技术栈回顾

    react刚刚推出的时候,讲react优势搜索结果是几十页. 现在,react已经慢慢退火,该用用react技术栈的已经使用上,填过多少坑,加过多少班,血泪控诉也不下千文. 今天,再谈一遍react优 ...

  5. 小谈React、React Native、React Web

    React有三个东西,React JS 前端Web框架,React Native 移动终端Hybrid框架,React Web是一个源码转换工具(React Native 转 Web,并之所以特别提出 ...

  6. React的React Native

    React的React Native React无疑是今年最火的前端框架,github上的star直逼30,000,基于React的React Native的star也直逼20,000.有了React ...

  7. React 与 React Native 底层共识:React 是什么

    此系列文章将整合我的 React 视频教程与 React Native 书籍中的精华部分,给大家介绍 React 与 React Native 结合学习的方法,此小节主要介绍 React 的底层原理与 ...

  8. React学习-React初识

    一.前言 为什么要去学习React呢,关于前端三大框架Angular,Vue,React其实都得去学吧,因为大家都在用啊,大家都再谈论啊,面试什么的都要求,没办法,曾几何时,大家都说求求大佬们别坑新了 ...

  9. JavaScript 和 React,React用了大量语法糖,让JS编写更方便。

    https://reactjs.org/docs/higher-order-components.htmlhttps://codepen.io/gaearon/pen/WooRWa?editors=0 ...

  10. 【React】react学习笔记01-概念与基本使用

      俺为啥要学这玩意:   家里的杂事好不容易处理完了,开始正式静下心来学习~博主是做后端开发的,js基础不深,之前也是用React写过许多东西了,但是基本上都是用的CV大法,别人的组 件修修改改拿来 ...

随机推荐

  1. Flask&&人工智能AI -- 8 HTML5+ 初识,HBuilder,夜神模拟器,Webview

    昨日内容回顾 1.增删改查: 增: db.collections.insert({a:1}) // 官方不推荐了 db.collections.insertMany([{a:1},{b:1}]) in ...

  2. UBoot添加命令的方法

    1. 具体实现步骤 ① 在./common文件夹下新建cmd_led.c,并在此文件中添加如下内容 #include <common.h> #include <command.h&g ...

  3. python3 rjust()函数笔记

    #rjust(12,'l')"12是字符串的长度,l是当字符串不够长的时候,用l填充.并且字符串右对齐".返回一个原字符串右对齐,并使用空格填充至长度 width 的新字符串.如果 ...

  4. ZoomEye(钟馗之眼)搜索技巧记录:

    做个记录方便查看 钟馗之眼: 指定搜索的组件:    app:组件名称    ver:组件版本    例:搜索 apache组件版本2.4:app:apache var:2.4指定搜素的端口:     ...

  5. canvas基础入门(二)绘制线条、三角形、七巧板

    复杂的内容都是有简单的线条结合而成的,想要绘制出复杂好看的内容先从画直线开始 canvas绘制直线先认识几个函数 beginPath():开始一条路径,或重置当前的路径 moveTo(x,y):用于规 ...

  6. team foundation server 工具的使用

    1.打开TFS工具点击创建集合,填写集合名称,下一步,按照步骤一步一步的往下操作. 2.创建完集合以后,打开VS工具,如下图,在主页上左键选择新建团队项目. 3.选择团队项目,然后选择新建的项目集合和 ...

  7. python_字典 学习

    一.创建字典(关联数组或hash表) 字典由键(key)和对应的值(values)组成. 代码: dic = { ‘ name‘:1 , ‘ zhang ’:2 , ‘ age‘ :3 , ‘ sex ...

  8. 使用Myeclipse导入IDEA项目

    问题描述:使用Myeclipse导入IDEA创建的Web项目,成功导入,但是显示的是一个普通的JAVA项目,无法加载到tomcat下. 解决方案:右键项目Properties,选择Myeclipse- ...

  9. Android 中实现分享和第三方登陆---以新浪微博为例

    第三方登陆和分享功能在目前大部分APP中都有,分享功能可以将自己觉得有意义的东西分享给身边的朋友,而第三方登陆可以借助已经有巨大用户基础的平台(如QQ和新浪微博)的账号,让用户在使用自己APP的时候不 ...

  10. HDU 2819 ——Swap——————【最大匹配、利用linker数组、邻接表方式】

     Swap Time Limit:1000MS     Memory Limit:32768KB     64bit IO Format:%I64d & %I64u Submit Status ...