水木又年华
水木又年华

React教程（一）React基础

1 React基础

目标

  • 能够说出React是什么
  • 能够说出React特点
  • 能够掌握React的基本使用
  • 能够使用React脚手架

1.1 React概述

官方网址

https://zh-hans.reactjs.org/

1.1.1 什么是React

React教程（一）React基础_第1张图片

React是一个用于构建用户界面的JavaScript库。

如果从MVC的角度来看，React仅仅是视图层V，也就是只负责视图的渲染，而非提供了完整的M和C的功能。

React起源于Facebook的内部项目，后来用来构建ins网站。

1.1.2 React的特点

  • 声明式
    • 你只需要描述UI（HTML）看起来是什么样，就跟写HTML一样。
  • 基于组件
    • 组件是React最重要的内容
    • 组件表示页面中的部分内容
  • 学习一次，随处使用
    • 使用React可以开发Web应用
    • 使用React可以开发移动端原生应用（react-native）
    • 使用React可以开发VR应用（react 360）

1.2 React的基本使用

1.2.1 安装React

安装命令

npm i react-dom
  • react包是核心，提供创建元素、组件等功能
  • react-dom包提供DOM相关功能

1.2.2 React的使用

1、引入react和react-dom两个js文件

<script src="./node_modules/react/umd/react.development.js"></script>
<script src="./node_modules/react-dom/umd/react-dom.development.js"></script>

2、创建React元素

const title = React.createElement('h1', null, 'Hello React')

3、渲染React元素到页面中

ReactDOM.render(title, document.getElementById('root'))

整体代码：

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    
    <script src="./node_modules/react/umd/react.development.js">script>
    <script src="./node_modules/react-dom/umd/react-dom.development.js">script>
    <title>01-react基本使用title>
head>
<body>
    <div id="root">div>
body>
<script>
    // 2 创建react元素
    // 参数1：元素名称   参数2：元素属性 第三个及其以后的参数3：元素的子节点
    const title = React.createElement(
        'h1', 
        {title:'我是标题'}, 
        'Hello React'
    )
    // 3 渲染react元素
    // 参数1：要渲染的react元素 参数2：挂载点
    ReactDOM.render(title, document.getElementById('root'))
script>
html>

实现效果：
React教程（一）React基础_第2张图片

1.3 React的脚手架使用

1.3.1 React脚手架意义

  1. 脚手架是开发现代Web应用的必备。
  2. 充分利用Webpack、Babel、ESLint等工具辅助项目开发。
  3. 零配置，无需手动配置繁琐的工具即可使用。

1.3.2 使用React脚手架初始化项目

1、初始化项目命令

npx create-react-app my-app

2、启动项目命令

cd my-app
npm start

3、启动成功

访问浏览器

localhost:3000

React教程（一）React基础_第3张图片

1.3.3 npx命令介绍

  • npm v5.2.0引入的一条命令
  • 目的：提升包内提供命令行工具的使用体验
  • 原来：先安装脚手架包，再使用这个包中提供的命令
  • 现在：无需安装脚手架包，就可以直接使用这个包提供的命令

推荐使用 npx create-react-app my-app

1.3.4 在脚手架中使用React

  1. 导入react和react-dom两个包

    1. import React from 'react'
import ReactDOM from 'react-dom'

  2. 调用React.createElement()方法创建react元素

  3. 调用ReactDOM.render()方法渲染react元素到页面中

首先，打开刚刚用脚手架创建好的my-app程序，删除index.js中的所有代码，添加以下代码:

import React from 'react'
import ReactDOM from 'react-dom'

const title = React.createElement('h1', null, 'Hello React')
ReactDOM.render(title, document.getElementById('root'))

可以看到页面已经自动刷新了：
React教程（一）React基础_第4张图片

1.4 基础总结

  • React是构建用户界面的JavaScript库

  • 使用react时，推荐使用脚手架方式

  • 初始化项目命令：

    • npx create-react-app my-app

  • 启动项目命令

    • npm start

  • React.createElement()用于创建react元素（知道就行，后面会介绍更加友好的创建元素的方式）

  • ReactDOM.render()用于渲染react元素到页面中

你可能感兴趣的:(react,react.js,前端框架)

  • 基于HarmonyOS 5.0 Next的应用开发设计模式与前端框架的架构整合与实践【附代码实例】 一键难忘 精通AI实战千例专栏合集harmonyos设计模式前端框架
    文章目录HarmonyOS5.0Next应用开发：架构设计中的设计模式与前端框架设计HarmonyOS5.0Next概览设计模式在HarmonyOS应用开发中的应用单例模式工厂模式观察者模式设计模式的使用分层架构设计1.公共能力层（CommonLayer）2.基础特性层（FeatureLayer）3.产品定制层（ProductLayer）模块化设计1.模块化结构2.模块化代码示例前端框架的设计Ar
  • Vue - 自定义Hooks 来一碗刘肉面 Vuevue.jsjavascript前端
    在Vue3中，自定义Hooks是一个强大的功能，允许开发者封装和重用逻辑。在Vue中它们通常通过组合式API实现。通过自定义Hooks，可以将复杂的逻辑封装在一个函数中，便于在多个组件之间共享。自定义Hooks是一个普通的JavaScript函数/TypeScript函数（js或ts），通常以use开头，并且它会使用Vue的响应式API，如ref、reactive、computed、watch等。
  • React Native 0.77发布，新样式特性，Android 16KB页面支持，Swift模板 wayne214 reactnativeandroidswift
    ReactNative0.77版本发布：新特性、改进与迁移说明2025年1月21日，ReactNative0.77正式发布，此版本带来诸多新特性、对Android的支持增强、社区模板更新以及一些重要变更。一、新特性亮点（一）CSS新特性助力布局、尺寸与混合效果display:contents简化布局逻辑：该属性使元素自身在布局结构中“消失”，但子元素仍正常渲染，就像直接作为父元素的子元素一样。在构
  • React Native 0.77 发布：更强的样式支持与性能优化 @大迁世界 reactnativereact.jsjavascriptecmascript
    ReactNative0.77正式发布！此次版本带来了多项重要改进，包括样式功能的增强、Android平台的性能优化以及项目模板的升级。这一版本的核心目标是提升开发效率，同时确保在不同平台上的兼容性。接下来，我们来看看这次更新中的亮点内容。主要更新内容✨全新CSS特性支持：新增对display:contents、boxSizing、mixBlendMode和outline等属性的支持。Androi
  • 解决React Native运行问题：编程指南 心之飞跃 reactnativereact.jsjavascript编程
    ReactNative是一种流行的跨平台移动应用开发框架，但有时候你可能会遇到无法运行ReactNative应用的问题。本文将提供一些常见问题的解决方法，帮助你快速解决ReactNative应用无法运行的情况。确保环境配置正确在开始解决ReactNative运行问题之前，首先要确保你的开发环境配置正确。以下是一些需要注意的关键点：Node.js：确保已经安装了最新版本的Node.js，并且可以通过
  • 前端的核心技术 善良的小乔 前端
    前端开发的核心技术主要围绕HTML、CSS、JavaScript三大基础语言展开，同时结合现代前端开发的需求，还包括前端框架、构建工具、前端安全和性能优化等内容。下面，我们详细解析前端开发中的核心技术。一.HTML（超文本标记语言）详解HTML（HyperTextMarkupLanguage）是前端开发的基础，用于构建网页的结构。HTML由各种标签（Tag）组成，每个标签都有不同的作用，主要用于定
  • ReactNative0.76版本发布，默认开启新架构 wayne214 ReactNative1024程序员节
    今天，我们非常激动地发布了ReactNative0.76版本！这是ReactNative的一个重要里程碑，因为我们默认启用了新架构，并引入了ReactNativeDevTools。这是我们团队六年辛勤工作的成果，也得到了我们了不起的开发社区的支持。亮点默认启用ReactNative新架构ReactNativeDevTools更快的Metro分辨率BoxShadow和Filter样式属性重大变更移除
  • vue3学习笔记（ref, reactive, setup, hook...） ***无名小卒 学习vue.js1024程序员节
    目录一、搭建项目二、常用的CompositionAPI1.ref函数（实现响应式）2.reactive函数3.vue2和vue3响应式的区别4.setup参数5.计算属性和监视6.vue3生命周期7.自定义hook8.toRef和toRefs9.其他组合式api10.新的组件一、搭建项目npminitvite-app进入项目npminpmrundev二、常用的CompositionAPI1.ref
  • 深入了解 React：从入门到高级应用 ╰つ゛木槿 web前端react.js前端前端框架
    深入了解React：从入门到高级应用React是由Facebook开发并维护的一个开源JavaScript库，用于构建用户界面。自2013年发布以来，React在前端开发领域迅速崛起，成为最受欢迎的UI构建工具之一。无论是小型的单页应用（SPA）还是复杂的大型企业级应用，React都能提供高效、灵活的解决方案。本文将全面、详细地介绍React，包括其核心概念、工作原理、最佳实践以及生态系统。目录：
  • 构建企业级React应用的进阶实践 python算法(魔法师版) react.js
    构建企业级React应用的进阶实践在当今前端开发领域，React凭借其组件化架构和声明式编程范式，已成为构建复杂用户界面的首选方案。本文将深入探讨React的高级应用场景，通过一系列精心设计的代码示例，展示如何打造高性能、可维护的现代化前端应用。一、状态管理的艺术1.1原子化状态管理typescript复制//lib/recoil/atoms.tsimport{atom,selector}from
  • web前端三大主流框架 109702008 人工智能编程前端框架人工智能
    Claude3OpusWeb前端开发中，目前有三个主流的框架：1.React：React是由Facebook开发的一款JavaScript库，用于构建用户界面。它采用组件化的开发模式，将界面拆分成多个独立且可复用的组件，使开发和维护更加高效。React的核心思想是虚拟DOM（VirtualDOM）和单向数据流，通过高效的DOMdiff算法进行页面更新，提供出色的性能和用户体验。2.Angular：
  • 低代码产品表单渲染架构 露临霜 低代码低代码
    在React和Vue没有流行起来的时候，低代码产品的表单渲染设计通常会使用操作Dom的方式实现。下面是一个表单的例子：产品层用户通过打开表单，使用不同业务场景业务下的表单页面，中间的Render层就是技术实现。每一个不同业务的表单页面就是低代码产品中的一个元素。技术层渲染层的核心在于View和Controller，现代基于框架实现一般是MVVM的实现。上面是基于传统的前端框架实现（Jquery)，
  • linux asio网络编程理论及实现 辣椒卷二王 网络boost/asio网络编程并发编程
    最近在B站看了恋恋风辰大佬的asio网络编程，质量非常高。在本章中将对ASIO异步网络编程的整体及一些实现细节进行完整的梳理，用于复习与分享。大佬的博客：恋恋风辰官方博客Preactor/Reactor模式在网络编程中，通常根据事件处理的触发时机和处理逻辑的分工可以分为reactor模式和preactor模式。reator是非阻塞同步网络模式,preactor是异步网络模式。阻塞I/O我们知道re
  • 全面掌握React：2025年学习路径指南 chenNorth。 前端reactreact.js学习前端
    文章目录第一步：Web开发的基石——JavaScript与TypeScript第二步：Web设计的核心——HTML与CSS第三步：进入React的世界第四步：用TailwindCSS进行样式设计第五步：用Shadcn/UI增强你的UI第六步：用ReactHookForm处理表单第七步：用Next.js提升你的技能第八步：用Remix掌握全栈开发第九步：ReactNative+Expo：轻松开发移动
  • 探索2025年最流行的移动端前端框架 程序猿000001号 前端框架
    探索2025年最流行的移动端前端框架正文：在当今快速发展的移动互联网时代，选择合适的前端框架对于开发高效、响应迅速的移动应用至关重要。以下是一些目前非常流行且备受开发者青睐的移动端前端UI框架。VantVant是一个轻量、可靠的移动端Vue组件库，适用于各种业务场景。它提供了丰富的组件和良好的文档支持，是许多电商应用的首选。ElementPlusElementPlus是基于Vue3的桌面端组件库，
  • 构建响应式管理后台系统（Python + Django + Bootstrap） 后端架构魔术骑士 pythondjangobootstrapPython
    在本文中，我们将使用Python编程语言结合Django和Bootstrap框架来构建一个响应式管理后台系统。我们将使用Django作为后端框架，处理数据和业务逻辑，并使用Bootstrap作为前端框架，实现用户界面的设计和布局。环境设置和项目创建首先，确保你已经安装了Python和Django。在命令行中运行以下命令来创建一个新的Django项目：$django-adminstartprojec
  • 前端经典样式参考 momomo_mocs 前端javascript开发语言
    左边导航栏；右边展示区组件间通信方式使用-根目录{{idx+1}}.{{navigateItem.title}}import{reactive}from'vue'letnavigaters=reactive([{title:"PropsLearn",linkPath:"/props"},{title:"CustomEvent",linkPath:"/props"},{title:"Provide-
  • 【React】React中将 Props 传递给组件 笨鸟程序员 react前端技术前端javascriptreact.js
    当使用React时，props是组件之间传递数据的主要方式。以下是针对您提到的五个问题的详细解答：1.如何向组件传递props在父组件中，你可以通过组件标签的属性（attributes）将props传递给子组件。这些属性在子组件内部可以通过props对象来访问。functionParentComponent(){constname='Alice';constage=30;return();}fun
  • react学习 guhy fighting reactreact.js学习前端
    react框架的选择低代码、BI前瞻性bs架构，网页客户端去使用react就是用来代替DOM的，dom操作，构建前端界面的react-native直接开发ios，安卓，原生应用虚拟dom，操作react，影响dom，中间人现在的dom和当前的dom做比较看哪个发生了变化，做最小的修改1、虚拟dom2、兼容性3、性能好，避免做一些多余的操作声明式编程：结果为导向命令式编程：过程为导向基于组件开发，组
  • react页面定时器调用一组多个接口，如果接口请求返回令牌失效，清除定时器不再触发这一组请求 每一天，每一步 antdesign-reactreact.jsjavascript前端
    为了实现一个React页面使用定时器调用一组多个接口，并在任意一个接口请求返回令牌失效时清除定时器且不再触发这一组请求，可以遵循以下步骤：1.定义API调用函数：创建一个函数来处理一组API调用。每个API调用都应该检查响应状态以确定令牌是否有效。2.设置定时器：使用useEffect钩子和setInterval来设置定时器，该定时器会定期调用上述API调用函数。3.错误处理：在API调用中加入错
  • 二、React进阶 谁诉离殇~ 框架(level1)#React系列(level2)#react(level3)react.jsjavascript
    一、代码分割为什么要使用代码分割：在用webpack进行打包的时候，每个模块被导入合并在一个文件，这个文件叫做bundle，这些bundle在一张页面上包括了整个APP。然而，当APP增长的时候，这些bundle尺寸开始变得越来越大，因此影响了页面加载时间使用antdesignpro的时候，打包出来的不是一个bundle文件，而是把每个模块打包成了一个async.js。如果用了代码拆分中的impo
  • React 19 深度剖析：从架构升级到性能优化 九情丶 react.js架构性能优化
    React19深度剖析：从架构升级到性能优化目录React19架构升级新特性深度解析性能优化最佳实践高级功能应用工程化实践迁移策略实战案例常见问题解决1.React19架构升级1.1新一代并发渲染引擎React19采用全新的并发渲染架构，显著提升了应用性能：//新的并发模式配置constroot=createRoot(document.getElementById('root'),{concurr
  • 从CV工程师到CtrlCV架构师：PromptCoder如何让前端搬砖变成乐高拼装 正宗咸豆花 前端人工智能AIGCai个人开发
    《从CV工程师到CtrlCV架构师：PromptCoder如何让前端搬砖变成乐高拼装》各位在座的代码艺术家、CSS炼金术师、React吟游诗人，今天我们要聊一个能让原型图自动「现出原形」的黑魔法——是的，我说的不是Figma切图插件，而是能让你的Ctrl+C/V进化成量子纠缠的PromptCoder。官网：PromptCoder当截图遇见AI：前端复刻的「降维打击」还记得那些年我们对着设计图手动敲
  • 【React系列】父子组件通信—props属性传值 川峰 ReactReactprops传值
    本文来自#React系列教程：https://mp.weixin.qq.com/mp/appmsgalbum?__biz=Mzg5MDAzNzkwNA==&action=getalbum&album_id=1566025152667107329)一.认识组件的嵌套组件之间存在嵌套关系：在之前的案例中，我们只是创建了一个组件App；如果我们一个应用程序将所有的逻辑都放在一个组件中，那么这个组件就会变
  • React使用less语法 世间万物皆对象 reactnpmwebpackreact.jsless前端
    1.安装yarnaddlessless-loaderornpmilessless-loader2.打开webpack配置文件创建项目的时候我们是看不到webpack文件的需要暴露出来yarnejectornpmruneject3.配置less语法环境在config文件下找到webpack.config.js文件打开webpack.config.js找到如下图：在下面添加如下两句代码：constle
  • React Native开发从入门到精通 赵梓宇 reactnative学习react.js
    目录第一部分：ReactNative入门ReactNative简介什么是ReactNativeReactNative与原生开发对比ReactNative的优缺点开发环境搭建Node.js和npm的安装ReactNativeCLI和Expo的安装与使用AndroidStudio和Xcode配置模拟器和真机调试环境搭建第一个ReactNative应用创建项目项目结构解析简单的页面编写和运行第二部分：R
  • 如何使⽤props在React组件之间传递数据？ 程序员玫玫 前端场景面试题-React篇react.js前端javascript前端框架面试深度学习
    在React中，props（属性）是组件之间传递数据的主要⽅式。props是⽗组件向⼦组件传递数据的⼀种机制。以下是使⽤props在React组件之间传递数据的步骤：1.定义⽗组件：在⽗组件中，你可以在渲染⼦组件时，通过属性（即props）传递数据。functionParentComponent(){constname='Alice';constage=30;return(HellofromPar
  • React应用深度优化与调试实战指南 python算法(魔法师版) javascript开发语言ecmascriptreact.js前端
    一、渲染性能优化进阶1.1精细化渲染控制typescript复制//components/HeavyComponent.tsximportReact,{memo,useMemo}from'react';interfaceItem{id:string;complexData:{//复杂嵌套结构};}constHeavyComponent=memo(({items}:{items:Item[]})=>
  • Next.js 高级缓存策略分析
    CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读在Next.js中，缓存机制往往是被诟病最多的特性之一。许多开发者对其工作方式并不满意。虽然缓存对提升React应用的性能至关重要，但如果对其原理不够理解，很容易导致棘手的错误。例如，页面在客户端显示陈旧数据的问题可能让你在调试时痛苦不堪。对Next.js缓存机制缺乏深入理解，就会让你不断遭遇意料之外的行为和Bug，每次都在不必要的
  • TypeScript 学习 - 创建一个项目 草明 TypeScripttypescript学习javascript
    创建一个项目实际使用中,使用yarncreatereact-app比npxcreate-react-app更顺利一些.使用yarncreatereact-appts-react-app--templatetypescript创建一个TypeScript项目使用yarncreatereact-appts-react-app创建一个JavaScript项目如果不使用脚手架创建,可以安装依赖,以及编写入
  • HQL之投影查询 归来朝歌 HQLHibernate查询语句投影查询
            在HQL查询中，常常面临这样一个场景，对于多表查询，是要将一个表的对象查出来还是要只需要每个表中的几个字段，最后放在一起显示？ 针对上面的场景，如果需要将一个对象查出来： HQL语句写“from 对象”即可 Session session = HibernateUtil.openSession();
  • Spring整合redis bylijinnan redis
    pom.xml <dependencies> <!-- Spring Data - Redis Library --> <dependency> <groupId>org.springframework.data</groupId> <artifactId>spring-data-redi
  • org.hibernate.NonUniqueResultException: query did not return a unique result: 2 0624chenhong Hibernate
    参考：http://blog.csdn.net/qingfeilee/article/details/7052736 org.hibernate.NonUniqueResultException: query did not return a unique result: 2         在项目中出现了org.hiber
  • android动画效果 不懂事的小屁孩 android动画
    前几天弄alertdialog和popupwindow的时候，用到了android的动画效果，今天专门研究了一下关于android的动画效果，列出来，方便以后使用。 Android 平台提供了两类动画。 一类是Tween动画，就是对场景里的对象不断的进行图像变化来产生动画效果（旋转、平移、放缩和渐变）。 第二类就是 Frame动画，即顺序的播放事先做好的图像，与gif图片原理类似。
  • js delete 删除机理以及它的内存泄露问题的解决方案 换个号韩国红果果 JavaScript
    delete删除属性时只是解除了属性与对象的绑定，故当属性值为一个对象时，删除时会造成内存泄露  （其实还未删除） 举例： var person={name:{firstname:'bob'}} var p=person.name delete person.name p.firstname -->'bob' // 依然可以访问p.firstname，存在内存泄露
  • Oracle将零干预分析加入网络即服务计划 蓝儿唯美 oracle
    由Oracle通信技术部门主导的演示项目并没有在本月较早前法国南斯举行的行业集团TM论坛大会中获得嘉奖。但是，Oracle通信官员解雇致力于打造一个支持零干预分配和编制功能的网络即服务（NaaS）平台，帮助企业以更灵活和更适合云的方式实现通信服务提供商（CSP）的连接产品。这个Oracle主导的项目属于TM Forum Live!活动上展示的Catalyst计划的19个项目之一。Catalyst计
  • spring学习——springmvc（二） a-john springMVC
    Spring MVC提供了非常方便的文件上传功能。 1，配置Spring支持文件上传： DispatcherServlet本身并不知道如何处理multipart的表单数据，需要一个multipart解析器把POST请求的multipart数据中抽取出来，这样DispatcherServlet就能将其传递给我们的控制器了。为了在Spring中注册multipart解析器，需要声明一个实现了Mul
  • POJ-2828-Buy Tickets aijuans ACM_POJ
    POJ-2828-Buy Tickets http://poj.org/problem?id=2828 线段树，逆序插入 #include<iostream>#include<cstdio>#include<cstring>#include<cstdlib>using namespace std;#define N 200010struct
  • Java Ant build.xml详解 asia007 build.xml
    1,什么是antant是构建工具2,什么是构建概念到处可查到，形象来说，你要把代码从某个地方拿来，编译，再拷贝到某个地方去等等操作，当然不仅与此，但是主要用来干这个3,ant的好处跨平台   --因为ant是使用java实现的，所以它跨平台使用简单--与ant的兄弟make比起来语法清晰--同样是和make相比功能强大--ant能做的事情很多，可能你用了很久，你仍然不知道它能有
  • android按钮监听器的四种技术 百合不是茶 androidxml配置监听器实现接口
    android开发中经常会用到各种各样的监听器,android监听器的写法与java又有不同的地方;    1,activity中使用内部类实现接口 ,创建内部类实例  使用add方法  与java类似   创建监听器的实例 myLis lis = new myLis();   使用add方法给按钮添加监听器  
  • 软件架构师不等同于资深程序员 bijian1013 程序员架构师架构设计
            本文的作者Armel Nene是ETAPIX Global公司的首席架构师，他居住在伦敦，他参与过的开源项目包括 Apache Lucene,，Apache Nutch， Liferay 和 Pentaho等。         如今很多的公司
  • TeamForge Wiki Syntax & CollabNet User Information Center sunjing TeamForgeHow doAttachementAnchorWiki Syntax
    the CollabNet user information center http://help.collab.net/   How do I create a new Wiki page? A CollabNet TeamForge project can have any number of Wiki pages. All Wiki pages are linked, and
  • 【Redis四】Redis数据类型 bit1129 redis
    概述 Redis是一个高性能的数据结构服务器，称之为数据结构服务器的原因是，它提供了丰富的数据类型以满足不同的应用场景，本文对Redis的数据类型以及对这些类型可能的操作进行总结。 Redis常用的数据类型包括string、set、list、hash以及sorted set.Redis本身是K/V系统，这里的数据类型指的是value的类型，而不是key的类型，key的类型只有一种即string
  • SSH2整合-附源码 白糖_ eclipsespringtomcatHibernateGoogle
    今天用eclipse终于整合出了struts2+hibernate+spring框架。 我创建的是tomcat项目，需要有tomcat插件。导入项目以后，鼠标右键选择属性，然后再找到“tomcat”项，勾选一下“Is a tomcat project”即可。具体方法见源码里的jsp图片，sql也在源码里。     补充1：项目中部分jar包不是最新版的，可能导
  • [转]开源项目代码的学习方法 braveCS 学习方法
    转自： http://blog.sina.com.cn/s/blog_693458530100lk5m.html http://www.cnblogs.com/west-link/archive/2011/06/07/2074466.html   1）阅读features。以此来搞清楚该项目有哪些特性2）思考。想想如果自己来做有这些features的项目该如何构架3）下载并安装d
  • 编程之美-子数组的最大和（二维） bylijinnan 编程之美
    package beautyOfCoding; import java.util.Arrays; import java.util.Random; public class MaxSubArraySum2 { /** * 编程之美 子数组之和的最大值（二维） */ private static final int ROW = 5; private stat
  • 读书笔记-3 chengxuyuancsdn jquery笔记resultMap配置ibatis一对多配置
    1、resultMap配置 2、ibatis一对多配置 3、jquery笔记 1、resultMap配置 当<select resultMap="topic_data"> <resultMap id="topic_data">必须一一对应。 (1)<resultMap class="tblTopic&q
  • [物理与天文]物理学新进展 comsci
          如果我们必须获得某种地球上没有的矿石,才能够进行某些能量输出装置的设计和建造,而要获得这种矿石,又必须首先进行深空探测,而要进行深空探测,又必须获得这种能量输出装置,这个矛盾的循环,会导致地球联盟在与宇宙文明建立关系的时候,陷入困境       怎么办呢?  
  • Oracle 11g新特性:Automatic Diagnostic Repository daizj oracleADR
    Oracle Database 11g的FDI（Fault Diagnosability Infrastructure）是自动化诊断方面的又一增强。 FDI的一个关键组件是自动诊断库（Automatic Diagnostic Repository-ADR）。 在oracle 11g中，alert文件的信息是以xml的文件格式存在的，另外提供了普通文本格式的alert文件。 这两份log文
  • 简单排序:选择排序 dieslrae 选择排序
    public void selectSort(int[] array){ int select; for(int i=0;i<array.length;i++){ select = i; for(int k=i+1;k<array.leng
  • C语言学习六指针的经典程序，互换两个数字 dcj3sjt126com c
    示例程序，swap_1和swap_2都是错误的，推理从1开始推到2，2没完成，推到3就完成了 # include <stdio.h> void swap_1(int, int); void swap_2(int *, int *); void swap_3(int *, int *); int main(void) { int a = 3; int b =
  • php 5.4中php-fpm 的重启、终止操作命令 dcj3sjt126com PHP
    php 5.4中php-fpm 的重启、终止操作命令: 查看php运行目录命令：which php/usr/bin/php 查看php-fpm进程数：ps aux | grep -c php-fpm 查看运行内存/usr/bin/php  -i|grep mem 重启php-fpm/etc/init.d/php-fpm restart 在phpinfo()输出内容可以看到php
  • 线程同步工具类 shuizhaosi888 同步工具类
    同步工具类包括信号量（Semaphore）、栅栏（barrier）、闭锁（CountDownLatch）   闭锁（CountDownLatch） public class RunMain { public long timeTasks(int nThreads, final Runnable task) throws InterruptedException { fin
  • bleeding edge是什么意思 haojinghua DI
    不止一次，看到很多讲技术的文章里面出现过这个词语。今天终于弄懂了——通过朋友给的浏览软件，上了wiki。  我再一次感到，没有辞典能像WiKi一样，给出这样体贴人心、一清二楚的解释了。为了表达我对WiKi的喜爱，只好在此一一中英对照，给大家上次课。   In computer science, bleeding edge is a term that
  • c中实现utf8和gbk的互转 jimmee ciconvutf8&gbk编码
    #include <iconv.h> #include <stdlib.h> #include <stdio.h> #include <unistd.h> #include <fcntl.h> #include <string.h> #include <sys/stat.h> int code_c
  • 大型分布式网站架构设计与实践 lilin530 应用服务器搜索引擎
    1.大型网站软件系统的特点？ a.高并发，大流量。 b.高可用。 c.海量数据。 d.用户分布广泛，网络情况复杂。 e.安全环境恶劣。 f.需求快速变更，发布频繁。 g.渐进式发展。 2.大型网站架构演化发展历程？ a.初始阶段的网站架构。 应用程序，数据库，文件等所有的资源都在一台服务器上。 b.应用服务器和数据服务器分离。 c.使用缓存改善网站性能。 d.使用应用
  • 在代码中获取Android theme中的attr属性值 OliveExcel androidtheme
    Android的Theme是由各种attr组合而成, 每个attr对应了这个属性的一个引用, 这个引用又可以是各种东西.   在某些情况下, 我们需要获取非自定义的主题下某个属性的内容 (比如拿到系统默认的配色colorAccent), 操作方式举例一则: int defaultColor = 0xFF000000; int[] attrsArray = { andorid.r.
  • 基于Zookeeper的分布式共享锁 roadrunners zookeeper分布式共享锁
    首先，说说我们的场景，订单服务是做成集群的，当两个以上结点同时收到一个相同订单的创建指令，这时并发就产生了，系统就会重复创建订单。等等......场景。这时，分布式共享锁就闪亮登场了。   共享锁在同一个进程中是很容易实现的，但在跨进程或者在不同Server之间就不好实现了。Zookeeper就很容易实现。具体的实现原理官网和其它网站也有翻译，这里就不在赘述了。   官
  • 两个容易被忽略的MySQL知识 tomcat_oracle mysql
    1、varchar(5)可以存储多少个汉字，多少个字母数字？ 　　相信有好多人应该跟我一样，对这个已经很熟悉了，根据经验我们能很快的做出决定，比如说用varchar(200)去存储url等等，但是，即使你用了很多次也很熟悉了，也有可能对上面的问题做出错误的回答。 　　这个问题我查了好多资料，有的人说是可以存储5个字符，2.5个汉字（每个汉字占用两个字节的话），有的人说这个要区分版本，5.0
  • zoj 3827 Information Entropy(水题) 阿尔萨斯 format
    题目链接：zoj 3827 Information Entropy 题目大意：三种底，计算和。 解题思路：调用库函数就可以直接算了，不过要注意Pi = 0的时候，不过它题目里居然也讲了。。。limp→0+plogb(p)=0，因为p是logp的高阶。 #include <cstdio> #include <cstring> #include <cmath&
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他