Code Monkey home page Code Monkey logo

vortex-react's Introduction

vortex-react

Build Status tested with jest codecov code style: prettier

Get start with React, Redux, RR4 🚀

Release 2.0.0 was build with create-react-app

👉 Online

中文

Table of Contents

Feature

  • React
  • ES6
  • Redux
  • React-Router-Dom
  • Reactstrap + Bootstrap^4.0.0-alpha.6 (UI)
  • Sass

Get Start

Before the start, we recommend you read these documentation.

You can try ES6 and JSX in Babel REPL.

We recommend node 6.x + npm 5.x + yarn ^0.27.5。

Installation

git clone https://github.com/yuthelloworld/vortex-react.git <my-project-name>
cd <my-project-name>
yarn  # Install project dependencies (or `npm install`)

Running

yarn start  # Start the development server (or `npm start`)

Scripts

yarn <script> Description
start Serves your app at http://localhost:3000
build Builds the application to ./build
test Runs unit tests
coverage Gets coverage
analyze Analyze the bundle size

Project Structure

Files Structure

.
├── build                    # All build-related code
├── public                   # Static public assets (not imported anywhere in source code)
└── src                      # Application source code
    ├── index.js              # Application rendering
    ├── components           # Global Reusable Components
    ├── layouts              # Components that dictate major page structure
    ├── routes               # Components that dictate major page structure
    │   ├── index.js         # Main application routes with store
    │   ├── Home             # Fractal route
    │   │   ├── index.js     # Route definitions and async split points
    │   │   ├── assets       # Assets required to render components
    │   │   ├── components   # Dumb Components
    │   │   └── routes **
    │   └── Zen
    │       ├── index.js
    │       ├── container    # Smart component
    │       ├── modules      # redux module(reducers/constants/actions)
    │       └── routes **
    ├── store                # Redux store
    │   ├── createStore.js   # Create store
    │   └── reducers.js      # Reducers
    └── styles               # Style sheet

Data Flow

redux

Logic

vortex-react


Contribution

Thank you to all the people who already contributed to vortex-react!

vortex-react's People

Contributors

keifergu avatar liadbiz avatar mrsususu avatar yuthelloworld avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

vortex-react's Issues

支持代理

如题。这个脚手架会在后期加入代理么?主要是方便前后端数据调试。或者是如何在本项目基础上配置代理插件

根据权限配置路由

您好。刚开始学redux。很喜欢您这套脚手架。让我熟悉了redux的数据流是如何工作的。感谢您的帮助。

在这儿冒昧的向您请教一下。如果要做权限配置。根据是否登录分配路由访问权限。显示不同内容(登录状态和非登录状态)。应该如何配置layout和router。?

Description in English

The project is apparently excellent, but I would like to read more about it in the documentation.

I wonder if you think about putting SSR.

reactstrap: for customizing component output with tag prop

There should be a page that describes customizing the component tag that is rendered. A great example would be a snippet that documents how to use this with a React Router Link.

import React from 'react';
import { Link } from 'react-router';
import { Container, Row, Col, Nav, NavItem, NavLink } from 'reactstrap';

const Example = (props) => {
  return (
    <NavItem>
      <NavLink tag={Link} to="/test" activeClassName="active">
        {props.item.name}
      </NavLink>
    </NavItem>
  );
};

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.