Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/rinminase/anidb
📝🚀 Rin Minase's Anime Database using Angular deployed to Netlify using Circle CI
https://github.com/rinminase/anidb
angular angular12 anidb bootstrap5 circleci firebase netlify progressive-web-app scss typescript
Last synced: 10 days ago
JSON representation
📝🚀 Rin Minase's Anime Database using Angular deployed to Netlify using Circle CI
- Host: GitHub
- URL: https://github.com/rinminase/anidb
- Owner: RinMinase
- License: mit
- Created: 2018-04-02T08:44:21.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2024-02-15T19:22:41.000Z (9 months ago)
- Last Synced: 2024-07-30T16:54:23.368Z (4 months ago)
- Topics: angular, angular12, anidb, bootstrap5, circleci, firebase, netlify, progressive-web-app, scss, typescript
- Language: TypeScript
- Homepage: https://anidb.netlify.app
- Size: 13.9 MB
- Stars: 5
- Watchers: 2
- Forks: 1
- Open Issues: 9
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
Rin Minase's Anime Database
## Introduction
This project uses Preact (Faster & Leaner React) with Vite and deployed to Netlify
## Getting Started
### Running the project
Installations Required:
- [Node](https://nodejs.org/en/)
- [Yarn](https://yarnpkg.com/latest.msi)
1. Clone the project and copy the ENV template file to a new ENV file.
```
git clone https://github.com/RinMinase/anidb.git
cd anidb
cp .env.example .env
```
2. Modify the created ENV file based on your Firebase configuration
3. Install the dependencies then run the project
```
yarn install
yarn start
```
4. Fire up your browser and go to `localhost:3000`
### Building the project
Installations Required:
- [Node](https://nodejs.org/en/)
- [Yarn](https://yarnpkg.com/latest.msi)
1. Fire up your terminal inside the project folder.
2. Build the project by running:
```
yarn build
```
3. This should generate a `dist/` folder inside the project folder.
### Project Structure
.
├── public/ # Public assets folder
├── dist/ # Compiled production code
├── src/ # Project source code
│ ├──/
│ │ ├── # Module sub-components
│ │ └── index.tsx # Module entry point
│ ├── common/ # Project-wide reusable code
│ │ ├── components/ # Common components
│ │ ├── pages/ # Common pages (404 / 500 pages)
│ │ ├── providers/ # Context provider components
│ │ └── index.ts # Entry point for common imports
│ ├── main.tsx # Main module
│ ├── routes.tsx # Routes file
│ ├── service.ts # Axios pre-setup
│ └── ... # Other source code files
├── .editorconfig # IDE / Editor configuration
├── .env # Environment file
├── index.html # Main HTML file (Vite bundler entry point)
├── tsconfig.json # Source code TypeScript configuration file
├── tsconfig.node.json # Vite TypeScript configuration file
└── ... # Other project files
> Notes:
>
> As to why the `index.html` file is located on the root of the project, refer to: https://vitejs.dev/guide/#index-html-and-project-root
### Project tasks
Task automation is based on [Yarn scripts](https://yarnpkg.com/lang/en/docs/cli/run/) or [NPM scripts](https://docs.npmjs.com/misc/scripts).
| Task | Description |
| --------------- | ------------------------------------------------- |
| `yarn dev` | Run **dev server** on `http://localhost:3000/` |
| `yarn preview` | Run **prod server** on `http://localhost:3000/` |
| `yarn build` | Build production code to `dist` folder |
| `yarn lint` | Runs code linter manually |
| `yarn cz` | Commitizen commit formatter |
## Built with
* 
[Preact](https://preactjs.com/) - Web Framework
* 
[TypeScript](https://www.typescriptlang.org/) - Language syntax
* 
[Vite](https://vitejs.dev/) - Source Code Bundler
* 
[Emotion CSS](https://emotion.sh/) - CSS pre-processor
* 
[Material UI](https://mui.com/) - Layouting Framework
* 
[Netlify](https://netlify.com) - Hosting Platform
## Deployed to
* [Netlify](https://anidb.netlify.com)