只回答前端部分 ※ 引述《silentcrane (寂静之鹤)》之铭言： : 目前是碰到的一些问题: : 1. React是把整个网页分隔成各种component(组件?原件?)，我蛮喜欢这种设计的 : 但是如果後面有改动或是增加新东西，其他的架构会不会被影响很大? : 例如说原本是两个组件,後来被合成一个... : (虽然想想，好像不管哪个Frameworks都会被影响 XDDD) (1) 实务上很少会把两个组件合成一个（除非你在讲 component composition)， 多半是把一个组件拆成两个 (2) 程式有改动会不会有巨大影响要看组件之间的耦合性强不强， 以 React 来说高耦合性的部分易发生在 parent <-> child 之间的沟通 改善方法诸如：使用第三方 observer pattern module 来降低父子之间关联， 使用类似 Redux 以及传递 props 到底层的方式。 但个人觉得你现在阶段不用担心这些。 : 2. 如果我有一堆图案(像是球队队徽)，我想在点其中一个时候 : 让其他的消失+显现出一些讯息。 : 这样的做法应该是把每个队徽都设成自己独立的组件吗? : 感觉是这样才能够去独立操控每一个的状态? : (React的基本写法是任何我想要单独处理的都要是一个独立组件? @@) 要不要把单一种类型的项目独立成一个组件没有标准答案， 如果操作复杂度很高的话会倾向独立。 以你的需求来说"看起来"可以用单一元件达成： ```js import React from 'react'; export default class IconList extends React.Component { constructor(props) { super(props); this.state = { icons: [], active: -1 // index of active icon } } render() { var dom = this.state.icons.map(function(icon, index) { var cls = ''; if (this.state.active >= 0) { cls = this.state.active === index ? 'active' : 'hidden'; } return <div className={"icon " + cls}>{icon}</div> }); return <div>{dom}</div> } } // 再来透过使用者 click 去改变 this.state.active 即可 // 但是当操作越来越复杂，越来越针对单一 item 特化时就可以独立出 <Icon /> ``` : 5. 目前看一些React解说，很多都有提到boilerplate 和 webpack : boilerplate = 样板? : webpack = ...?? OTL : 想开始写code之前是不是得先搞懂这两个是甚麽呢? OAO 两者都非必要 (1) 新手从 boliderplate 开始反而会不知道什麽是必要的，以及为什麽要有这些东西 (2) webpack 是协助打包以及处理依赖相关, 做 preprocessing/postprocessing ... 的 build tool, 如果没有要用 ES6 写 React 可以先不学 但如果要学 ES6 的话搭配 babel + react 事半功倍。 --

※ 发信站: 批踢踢实业坊(ptt.cc), 来自: 36.225.46.60 ※ 文章网址: https://webptt.com/cn.aspx?n=bbs/Web_Design/M.1471328309.A.E25.html ※ 编辑: davidsky (36.225.46.60), 08/16/2016 14:19:42