These instructions will get you a copy of the project up and running on your local machine for development and testing purposes. See deployment for notes on how to deploy the project on a live system.
- Git https://git-scm.com/
- NodeJs https://nodejs.org/
- Yarn https://yarnpkg.com/
- Docker https://www.docker.com/ (Only if using docker for development environment)
- Clone this repo to your local machine
git clone https://github.com/fannani/kodekurawal-web.git
- Copy .env.example file to .env on the root folder. You can type
copy .env.example .env
if using command prompt Windows orcp .env.example .env
if using terminal, Ubuntu. - Open your .env file and change the environment to whatever you have, By default, the server url and the api url is the production api and you can leave it.
- Install all package dependency using command
yarn
- Run
yarn run dev
to start the app - Go to
localhost:3000
- run
docker compose up
to run docker container - Go to
localhost:3000
Just push to branch master and Travis CI/CD automatic build and deploy your app
git add .
git commit -m "commit message"
git push origin master
- Push source code to the server
- Configure
.env
file yarn build
creates a build directory with a production build of your app- run
node ./build/index.js
to start the server
- Sign up For Heroku https://www.heroku.com/
- Create Heroku Git Repository
- install heroku-cli https://devcenter.heroku.com/articles/heroku-cli
- type
heroku login
to cmd - type
heroku create
(You should see two links after running this command. Copy the second one) - type
git remote add heroku PASTE THE LINK YOU JUST COPIED
- type
git push heroku master
to push source code to server - Once you run the last command Heroku will start to run some tests on your app. If everything goes right you should see a successful deploy message. Now you’re able to navigate to your app by running:
heroku open
- Push source code to the server
- Configure
.env
file - run
docker-compose -f docker-compose.prod.yml up -d
- React - The web framework used
- Yarn - Dependency Management
- Apollo Client - GraphQL Client
- Redux - State Management
- styled-components - Style Library
We use SemVer for versioning, see https://semver.org/ for the detail
.
├── ...
├── src # Source files
│ ├── assets # Images, CSS, etc
│ ├── components # React UI Component
│ ├── config # Configuration files (route, store, etc)
| ├── data # Global state management
| ├── hooks # Custom hooks
| ├── pages # All pages container
| ├── queries # Graphql queries for request data to the api server
| ├── services # Library to connect other service
| ├── themes # All themes settings (kodekurawal, sainfikasi)
| ├── utils # Tools and utilities
| └── ...
└── ...
To change the theme, open .env file and change REACT_APP_THEME variable value to the theme you chose
- sainfikasi
- kodekurawal
All theme are defined in the folder src/themes