This project was generated using Nx. You will need to ensure you have installed Nx, npm and NodeJS globally.
ZipCaptions is a client-side applicaation built using Angular, Tailwind CSS, DaisyUI components, Angular Animations library, Hero Icons. Translations are provided using the functionality from the ngx-translate library.
Clone the repository and navigate into the cloned folder. From the root of the repo, run npm install
to download all required packages.
To run the development server on your local machine, use the command nx serve client
to build and serve the application. Then, in your web browser, navigate to http://localhost:4200
to view the app running on your local machine.
If you prefer to use docker to build and run the application, this is easily done. From the root directory of this project, you can use the following command with docker and docker compose:
Build the application
docker compose build ./
Run the container
docker compose up
Alternatively, if you would like to pull the next release candidate from the develop branch, you can use the image from docker hub. A sample entry docker-compose.yml
file entry would look like this:
version: '3'
services:
zipcaptions:
container_name: zip-captions
image: educoder/zip-captions:develop
ports:
- 4200:80
All modules, components, and services are generated using the Nx CLI, or the VS Code Nx extension. Any new additions should be organized according to the existing folder structure, and adhere to the following guidelines:
The application manages state using NGRX. Each "feature" (e.g. settings, recognition) has its own state, effects, reducers, and actions. Adding a feature will require a new feature state as well as all supporting NGRX requirements.
Core components are used to provide general app-level UI/UX. For example, the welcome splash screen, the header, and the footer are all core components. These live in the components
folder found within the app
folder.
Core components should adhere to the best practices for DaisyUI Components. Any vector icons that are required should be found within the HeroIcons library, and added to the shared-ui library vectors.ts
file, following the same format as other examples included in the file.
All classes and styles should also adhere to both TailwindCSS and DaisyUI class names. Direct colour bindings are discourages, DaisyUI includes pseudo-classes that reference theme values, which are user-selected (e.g. bg-base-100
, btn-primary
, etc).
Animations are provided by the Angular Animations package. Custom animations should be avoided, it is preferred to use predefined animations from the included library to ensure consistency and maintainability.
Each module contains all required files for implementation of an existing feature within the app. These are built with lazy-loading routes, so that the application will only load the files if/when required. Modules implement their own NGRX feature state, and respect any user settings to enable/disable features. Be sure to verify that the routes defined appear and work as expected when using the application.
You are welcome to fork this repository for your own uses. You must adhere to the license as described in LICENSE, as well as all licenses from all 3rd party libraries, defined in 3rdpartylicenses.txt. If you are creating a fork for reasons other than submitting a pull request, we would love to hear from you! Submit an issue to let us know what we're missing!
Please fork the repository, make your changes, and submit a pull request describing the changes made, as well as a rationale for why they are necessary/useful. Pull requests will be reviewed as soon as possible, clear actionable changes will be requests if required, and once all is approved, the PR will be merged into the main project and deployed.
Donations are not expected, but are more than welcome! We accept monetary support through buymeacoffee. Any contributions are put toward offsetting the operating costs (such as they are), or implementing new features. We operate without any formal financial backers or sponsorhips, and have no corporate backers in any form. This is an entirely community-supported endeavour.