Terampil FE Repository

Main front-end repository for terampil.com development

Development Information

Please read this information carefully before going to develop the core of this platform. Below are pre-requisites that you must full-fill in order to develop the platform.

Tech Stack

For this first version, we use technology stacks as follows:

• Typescript
• Next.js
  • Micro
  • React
  • Emotion
  • CSS Modules (only for SASS/SCSS files)

So, make sure you have a:

• Node JS installed (>=8.0.0)
• Yarn installed

Dont forget to duplicate .env.example file to .env, and write your own server configuration there.

Branching

Please use the branching guidelines, as follows:

• master:
  • Protected: Yes
  • Description: Will only used whenever we have to release to production. Minor/Less Bug accepted. Can only merged after decision at sprint retro.
  • Auto/Deploy: Production Server at https://terampil.com.
• stage:
  • Protected: Yes
  • Description: Will only used to UAT (User Acceptance Test). Minor/Less Bug accepted. Can only merged after decision at sprint retro.
  • Auto/Deploy: Staging Server at https://stage.terampil.id.
• test:
  • Protected: Yes
  • Description: Will only used to internal test. Bug's are accepted.
  • Auto/Deploy: Testing Server at https://test.terampil.id.
• feature/feature-name:
  • Protected: No
  • Description: You must create new feature branch with cloned from master branch. The feature name is based on the issue title created.
  • Auto/Deploy: No
• hotfix/hotfix-name:
  • Protected: No
  • Description: You must create patch/bugfix feature branch with cloned from master branch. The hotfix name is based on the issue title created.
  • Auto/Deploy: No

Deployment

We're using Codeship for deploying to the servers. You can push to branch test to begin deploying to test.terampil.id.

How To's

• You're free to create any branch for your own testing purpose.
• For Merge Request, don't forget to check to remove your current branch upon successfull merge.
• Each Merge Request, please inform me at Whats App group if in any condition I'm forgot to check and review your merge request.

Contribute

Use Conventional Commits to standardize commit messages:

1. You need to write your commit title as below.

   type(scope): description

   With type must be one of the following:

   • feat: A new feature
   • fix: A bug fix
   • docs: Documentation only changes
   • storybook: Storybook only changes
   • refactor: A code change that neither fixes a bug nor adds a feature
   • style: Changes that do not affect the meaning of the code (white-space, formatting, missing semi-colons, etc)
   • test: Adding missing tests or correcting existing tests
   • perf: A code change that improves performance
   • build: Changes that affect the build system or external dependencies (example scopes: gulp, broccoli, npm)
   • ci: Changes to our CI configuration files and scripts (example scopes: Travis, Circle, BrowserStack, SauceLabs)

   For example,

   • fix(Nav): Bug "active" className when match current route
   • feat(Header): Add avatar image

2. If your commit is also a breaking change, you need to write an optional description as the example below.

   BREAKING CHANGE: Deprecate several props on Button

It is important so each package that is being generated every publish can be as descriptive as possible.

Development Structure

Below are development structure:

| File or Directory | Description | | ---------------------- | ------------------------------------------------------------------------ | | src/components | You can separate any component here. Use in pages or related components. | | src/pages | Define all page screens here. | | src/server/routes.ts | Define your routes here. |