Code Monkey home page Code Monkey logo

kodo's Introduction

kodo

Build Status Coverage Status

How to Run

首先你需要通过命令npm install来安装所需要的依赖环境。整个项目分为了两个部分,kodo 库源码和 examples 展示例子。

你可以运行 npm run dev 来构建 kodo 项目开发者版本,然后运行 npm run examp 来构建 examples 展示例子。

现在你可以运行 npm run dev-server 来启动一个Web 服务器,这样在地址栏输入: http://localhost:3000/#/index/ 就可以访问 Demo 了。

How to Update

你可以使用 npm outdate 命令来查询是否需要更新,然后再运行 npm update 来个更新你的应用环境。

结构与参与项目方式说明

kodo 项目的源码放置在顶层的 src 目录下,如果你需要创建一个组件:

  • components 目录中创建你的组件目录和 index.js 文件
  • 在入口 index.js 文件中导出你的组件
  • 请注意将你的组件和导出组件使用大小写区分,例如 components/button ,导出时可以使用 Button

当你编写完一个组件时,需要进行测试:

  • test 目录中编写单元测试文件
  • examples/src/interface 目录中创建你的展示例子目录
  • examples/src/router 路由文件中配置好你的路由

当你想亲自参与这个开源项目时可以Fork kodo 项目,按照上述的方式来添加新的组件和展示例子,那么你就可以发送 PR 给我们了。

import React, { PropTypes } from 'react';
import { render } from 'react-dom';
import { Router, Route, hashHistory, IndexRoute } from 'react-router';
import NoPages from '../components/nopages/';
import IndexPages from '../interface/index/';
import ButtonPages from '../interface/button/'

const propTypes = {
  children: PropTypes.element
};

// Web App 启动

class AppStart extends React.Component {
  render() {
    if (!this.props.children) {
      return null;
    }
    return (
      <div
        className="app-container"
      >
        { this.props.children }
      </div>
    );
  }
}

AppStart.propTypes = propTypes;

module.exports = {
  start() {
    render((
      <Router
        history={ hashHistory }
      >
        <Route
          path="/"
          component={ AppStart }
        >
          <IndexRoute component= { IndexPages } />
          <Route path="button" component={ ButtonPages } />
          <Route path="*" component={ NoPages } />
        </Route>
      </Router>
    ), document.getElementById('app-container'));
  }
};

感谢

感谢好友 结一 提供了CSS UI sheral项目。

开源遵循

The MIT License (MIT)

Copyright (c) 2016

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

kodo's People

Contributors

icepy avatar yuanxj1024 avatar marvin1023 avatar vanshady avatar

Watchers

James Cloos avatar 幕風 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.