Better code structure

[wildan3105]

Current behavior:
Currently, because the repo is full-stack which means frontend and backend are stored in the same repo, the folder structure is a bit messy. So we need to re-structure the folder & files based on the best practice while still not breaking any functionality. Also, in the future, I prefer to move from template engine to a js frontend framework like react. So we need to make this to be future proof or at least make it easy towards that goal.

Expected behavior:
Proposed solution:

├── public --> only store static files (image, json file, localization)
│   ├── css
│   └── image
│   └── json
│   └── js (this to make it backward compatible for public utils)
├── src --> store "full-stack" files but differentiate it on the child folder
│   ├── index.js -> boot file
│   ├── api -> backend-related files
│   ├── ├── app.js
│   └── ├── controller.js
│   └── ├── routes.js
│   └── ├── service.js
│   ├── pages -> frontend, template engine files
│   └── ├── layouts
│   └── ├── partials
│   └── ├── index.handlebars
│   ├── utils --> store all utilization file
│   ├── ├── emoji_generator.js
│   ├── ├── language_colors_generator.js
├── config --> store all configuration files
│   ├── api_url.js
│   ├── error_messages.js
│   ├── statements.js
├── tests --> store all unit tests
└── .github/
└── .editorconfig
└── .eslintrc.json
└── .gitignore
└── .travis.yml
└── CODE_OF_CONDUCT.md
└── CONTRIBUTING.md
└── gulpfile.js
└── LICENSE
└── package-lock.json
└── package.json
└── README.md
└── screenshot.png

Please help to suggest something 😃

[wildan3105]

This issue is tracked in this branch: https://github.com/wildan3105/github-langs/tree/refactor/improve-codebase-structure

[wildan3105]

PHASE 1 is done

PHASE 2 goals:

• move all github API calls to src/api/service.js
• improve logic in src/api/controller.js, especially data manipulation