react-torch v1.17.0-alpha.13

React-torch

A react framework.

Getting Started

• Create Project

> mkdir your-project

> cd your-project

> npm init -y

• Install Dependences

> npm install react react-dom react-torch typescript

Without Typescripts: npm install react react-dom react-torch

• Add Scripts

Add follow code in package.json

{
  "scripts": {
    "dev": "torch dev",
    "build": "torch build",
    "start": "yarn dev",
    "debug": "node --inspect-brk node_modules/.bin/torch dev",
    "serve": "torch start",
    "help": "torch --help",
    "version": "torch --version"
  }
}

• Add src and index

// src/index.ts
export default [
  {
    path: '/',
    module: () => import('./home/Controller'),
  },
]

• Add Page

// src/home/index.ts
import React from 'react'
import { createPage } from '../../../src'
import store from './store'
import './style.css'
import type { History } from 'torch-history'
import type { Context } from '../../../src/index'

// const ignorePropsChanged = View => {
//   let MemoizedView = (props) => {
//     let view = React.useMemo(() => {
//       return <View />
//     }, [])

//   return view
//   }
// }

const getView = (history: History, context: Context) => () => {
  const state = store.getState()

  const INCREASE = () => {
    store.dispatch({ type: 'INCREMENT' })
  }

  const handleClick = () => {
    history.push('/test')
  }

  return (
    <div>
      Home {state.count} <button onClick={() => INCREASE()}>Increate</button>
      <hr />
      <a href="/about">about</a>
      <hr />
      <a href="/test">test</a>
      <hr />
      <a className="test" onClick={handleClick}>
        test
      </a>
    </div>
  )
}

export default createPage(async ({ history, context }) => {
  return {
    Component: getView(history, context),
    store,
    create: async () => {
      return getView(history, context)
    },
    destory: async (location) => {
      console.log(location, 'home destory')
    },
  }
})

• Start With Development

npm run dev

• Build

npm run build

• Start After Build In Production

npm start

Document

Visit docs to view the documentation.

Contributing

Please see our contributing.md.

Author

Ma Tianqi(@tqma113)

License

MIT