项目作者: Falieson

项目描述 :
Typescript+React+Asteroid+Meteor project starter (example)
高级语言: JavaScript
项目地址: git://github.com/Falieson/TRAM.git
创建时间: 2017-08-11T18:36:36Z
项目社区:https://github.com/Falieson/TRAM

开源协议:MIT License

下载


typescript-react-asteroid-meteor | Sustainable, Large Scale, Meteor-Independent

Commitizen friendly

Made with asteroid (ddp), create-react-app, typescript, react, and meteor


Contributing

Before contributing at least read the Commitizen_Semantics.md documentation.

RTFM

  1. .
  2. ├── /docs/ # Documentation for contributing to the repo
  3. └── /CLI_Config.md # Setting up CLI (git, npm, bash, brew, etc.)
  4. └── /Commitizen_Semantics.md # Commitizen (contribution) specific terminology
  5. └── /Semantics.md # General terminology for the project/repo
  6. └── /client
  7. └── /docs/ # Client development documentation
  8. ├── /Asteroid_juliancwirko_README.md #
  9. ├── /Chrome_DevelopmentProfile.md #
  10. ├── /CreateReactApp_README.md #
  11. ├── /React_Modular_Component_Design.md #
  12. ├── /ReactUnitTesting_EnzymeJest.md #
  13. └── /TSLint_README.md #

Commitizen

This repository uses ‘commitizen’, start a commit with

  1. $ npm run commit
  2. npm run git-cz

Precommit Hook

Before a commit is saved, the precommit script will run, for example: "precommit": "npm run test" which will run the test script.

You can skip the precommit hook from running by passing --no-verify to commit like :

  1. $ npm run commit --no-verify # like git commit --no-verify
  2. npm run git-cz --no-verify

Client (Node) & Server (Meteor) Architecture

This application is architected so the Frontend operates completely independently from the backend.

File Structure

  1. .
  2. ├── /.vscode/ # IDE configuration and typing build directory
  3. ├── /client/ # Client-side (frontend) development
  4. ├── /.vscode/ # IDE configuration
  5. ├── /config/ # Webpack, Jest, polyfills, and misc.
  6. ├── /coverage/ # generated by npm run test:coverage
  7. ├── /docs/ # Docs for Frontend development (related to client side libraries)
  8. ├── /public/ # Static files which are copied into the /build/public folder
  9. ├── /scripts/ # Commands for build/start/test
  10. ├── /src/ # The source code of the application
  11. ├── /config/ # Configuration of asteroid and other libraries
  12. ├── /components/ # App specific components which shouldn't be extracted to "abs"
  13. ├── /data/ # Asteroid (or GraphQL) subscriptions and collection calls
  14. ├── /routes/ # Page/screen components along with the routing information
  15. └── ... # Other core framework modules
  16. ├── /typings/ # The source code of the application
  17. ├── .gitignore # Client .gitignore (use this except for extractable modules)
  18. ├── package-lock.json # Fixed versions of all the dependencies
  19. ├── package.json # List of 3rd party NPM libraries and utilities
  20. ├── tsconfig.json # TypeScript compilerOptions and other settings
  21. ├── tsconfig.test.json # TypeScript settings for test runner
  22. └── tslint.json # TSLint settings
  23. ├── /server/ # Server-side (backend) development
  24. ├── /.meteor/ # Meteor's configuration and build directory
  25. └── /packages # Atmosophere (Meteor 3rd Party) libraries and utilities
  26. ├── /.vscode/ # IDE configuration and typing build directory
  27. ├── /docs/ # Docs for Backend development (related to server side libraries)
  28. ├── /imports/ # (meteor doesn't lazy load this directory)
  29. ├── /data/ # publications & methods
  30. ├── /startup/ # Server config: accounts, register-apis, fixtures
  31. ├── /node_modules/ # Meteor's 3rd-party libraries and utilities
  32. └── /server/ # Meteor's Server-side only hooks
  33. ├── .gitignore # Server .gitignore (use this except for extractable modules)
  34. ├── package-lock.json # Fixed versions of all the dependencies
  35. ├── package.json # List of 3rd party NPM libraries and utilities
  36. └── eslint.json # ESLint settings
  37. ├── .gitignore # Global .gitignore (use this except for extractable modules)
  38. ├── LICENSE # Repository License
  39. ├── package-lock.json # Fixed versions of all the dependencies
  40. └── package.json # Repository info. and commit scripts

Motivation

As long as Meteor bundles isobuild and doesn’t give a route for using webpack, there will be a need to leave Meteor’s “unified” approach to development. And for the more sophisticated developers - this is probably the more sustainable way to go, if you’re even still using Meteor…

For the sake of PostCSS (this time)

My specific motivation for seeking a Meteor offramp is b/c the community implementation of PostCSS for Isobuild is no longer maintained or working. I would recommend against anyone using LESS & SCSS for react development when there is PostCSS. PostCSS is modular, its where the community is, and its growing. Finally, I’m starting a new react application that should be built as independent from Meteor as possible; therefore why make a bunch of frontend code that uses Meteor’s Isobuild for generating CSS assets when one day I’m definitely going to use PostCSS anyways and that will require (possible large) refactor from Meteor’s LESS/SCSS to PostCSS.

In this new “asteroid” client/server world waht does Meteor do? What its great at (not frontend stuff), but providing a DDP connection to MongoDB for reactive (real-time)applications.

Based on Asteroid example: “juliancwirko/react-redux-webpack-meteor”

the INIT commit is a clone of juliancwirko/react-redux-webpack-meteor

Features

  • webpack2 (via create-react-app)
  • asteroid connection to meteor as ddp server
  • typescript config’d
  • tslint config’d
  • react-router
  • redux
  • react-router-redux
  • Kea Redux

Coming Soon

  • tasklist module w/ unit testing
  • local npm modules for large scale ui development
  • meteor (/server) testing w/ Chimp
  • Jest unit testing w/ snapshots