Kanji words visualization graph
For more information about structure and functionality, see the docs directory.
https://tvmbj3cgmr.us-east-1.awsapprunner.com/
docs- Documents and diagrams for software design
frontend- Source files for frontend
Dockerfile
backend- Source files for backend
Dockerfile
docker-compose.yml
docker-compose builds frontend/Dockerfile and backend/Dockerfile, and runs them.
Where Controllers are considered to be in backend, and Views are in frontend.
-
Start Docker Desktop.
-
Clone the repository.
git clone https://github.com/ani-hovhannisyan/kanji-visualization.git cd kanji-visualization -
Run Docker Compose.
docker-compose up (or on Linux docker compose up)
This will start the frontend and backend server automatically. Now, you can start developing with Docker.
The app can be viewed at http://localhost:3000.
While the server is running, any changes you make to the source code will be reflected on the screen in real time.
-
Clone the repository.
git clone https://github.com/ani-hovhannisyan/kanji-visualization.git cd kanji-visualization -
Run Docker Compose.
docker-compose up (or on Linux docker compose up)
This will start the frontend and backend server automatically. Now, you can start developing with Docker.
The app can be viewed at http://localhost:3000.
While the server is running, any changes you make to the source code will be reflected on the screen in real time.
- Node.js >= 14.0.0
- Python >= 3.6
-
Install Python and Node.js.
-
Install yarn.
npm install -g yarn
-
Clone the repository.
git clone https://github.com/ani-hovhannisyan/kanji-visualization.git cd kanji-visualization -
Install dependencies.
Python dependencies:
pip install -r ./backend/requirements.txt
Node.js dependencies:
cd frontend yarn install -
Setup pre-commit.
pre-commit install
-
Start servers.
FastAPI server:
cd backend uvicorn main:app --reload --host 0.0.0.0 --port 8000or just
cd backend ./start-server.shReact server:
cd frontend yarn startThese will start the frontend and backend server respectively. Now, you can start developing on your local PC without Docker.
The app can be viewed at http://localhost:3000.
While the server is running, any changes you make to the source code will be reflected on the screen in real time.
When you make changes to the source files and run git commit, pre-commit hooks will automatically run the following tools.
| Linter | Formatter | Static Type Checker | |
|---|---|---|---|
| Backend | flake8 | black | mypy |
| Frontend | ESLint | Prettier | (ESLint) |
Here is an example of the result.
If all processes are passed or skipped, then commit will be executed as usual.
However, if any errors occur, commit will be terminated. In that case, you have to fix the error, then git add the change, and git commit it again.
For more information on the pre-commit, please see here.
The above pre-commit hooks are automatically executed on each commit, but you can also execute them manually by the following commands.
-
Run flake8
cd backend flake8 .
-
Run black
cd backend black .
-
Run mypy
cd backend mypy .
-
Run ESLint
cd frontend yarn lint -
Run Prettier
cd frontend yarn format
Before you run git push, please make sure your changes pass the tests.
If you have updated the backend source code, please run
cd backend
pytestOr if you have updated the frontend source code, please run
cd frontend
yarn test --watchAll=falseor just
cd frontend
./test.shIf all tests are passed, you can run git push.
After pushing the changes, CI/CD will automatically be executed on GitHub Actions.
- main: only a develop branch is merged to main
- develop: all feature branches are merged to develop
- feature/XXXX: for develop feature
- bugfix/XXX : for bugfix
- release: for deploy
- Github Action is not working now, So We have to build images on local and push it to ECR manually.
