-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
1 changed file
with
27 additions
and
23 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,30 +1,34 @@ | ||
# React + TypeScript + Vite | ||
# Chefies Frontend | ||
The promotional landing page for Chefies made with React, TypeScript, and Vite. This is being made as a requirements to complete the Bangkit capstone project. | ||
|
||
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. | ||
## Development Environment Installation | ||
|
||
Currently, two official plugins are available: | ||
### Requirements | ||
Before installing, you need to make sure that Node and PNPM is installed in your computer. Follow these guidelines: | ||
- [Node Installation](https://nodejs.org/en/download/package-manager). | ||
- [PNPM Installation](https://pnpm.io/) | ||
|
||
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh | ||
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh | ||
|
||
## Expanding the ESLint configuration | ||
|
||
If you are developing a production application, we recommend updating the configuration to enable type aware lint rules: | ||
### Installing Dependencies | ||
In the project root directory where `package.json` and `pnpm-lock.json` is located, run: | ||
``` | ||
pnpm install | ||
``` | ||
This command will install required dependencies to run the application. | ||
|
||
- Configure the top-level `parserOptions` property like this: | ||
### Running the Application | ||
After installing the dependencies, run this command to run the application. | ||
``` | ||
pnpm dev | ||
``` | ||
|
||
```js | ||
export default { | ||
// other rules... | ||
parserOptions: { | ||
ecmaVersion: 'latest', | ||
sourceType: 'module', | ||
project: ['./tsconfig.json', './tsconfig.node.json'], | ||
tsconfigRootDir: __dirname, | ||
}, | ||
} | ||
## Deployment | ||
You can build the static files for this React application using this command: | ||
``` | ||
pnpm build | ||
``` | ||
|
||
The static files will be located in `dist` folder. Put those files in static file server. For example, you can use NGINX or Caddy. | ||
|
||
- Replace `plugin:@typescript-eslint/recommended` to `plugin:@typescript-eslint/recommended-type-checked` or `plugin:@typescript-eslint/strict-type-checked` | ||
- Optionally add `plugin:@typescript-eslint/stylistic-type-checked` | ||
- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and add `plugin:react/recommended` & `plugin:react/jsx-runtime` to the `extends` list | ||
## Contributors | ||
- C010D4KY0602 – Emir Shamsuddin Fadhlurrahman – Universitas Indonesia | ||
- C010D4KY1156 – Rendy Arya Kemal – Universitas Indonesia |