https://github.com/open-template-hub/web-ui-template
Web UI Template is a modern, responsive, and customizable web UI template for your business. It contains reusable components, theme color, and design support along with dark theme support.
https://github.com/open-template-hub/web-ui-template
angular angular-components template ui-components
Last synced: 11 months ago
JSON representation
Web UI Template is a modern, responsive, and customizable web UI template for your business. It contains reusable components, theme color, and design support along with dark theme support.
- Host: GitHub
- URL: https://github.com/open-template-hub/web-ui-template
- Owner: open-template-hub
- License: mit
- Created: 2020-03-07T19:59:41.000Z (about 6 years ago)
- Default Branch: develop
- Last Pushed: 2025-04-14T04:22:02.000Z (12 months ago)
- Last Synced: 2025-04-14T05:29:36.865Z (12 months ago)
- Topics: angular, angular-components, template, ui-components
- Language: TypeScript
- Homepage: https://opentemplatehub.com/product/user-interface/web-ui-template
- Size: 24 MB
- Stars: 13
- Watchers: 2
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Security: SECURITY.md
Awesome Lists containing this project
README
Open Template Hub - Web UI Template v5
[](LICENSE)
[](https://github.com/open-template-hub/web-ui-template/issues)
[](https://github.com/open-template-hub/web-ui-template/pulls?q=is%3Apr+is%3Aclosed)
[](https://github.com/open-template-hub/web-ui-template/commits/master)
[](https://github.com/open-template-hub/web-ui-template/releases)
[](docs/lighthouse)
[](https://sonarcloud.io/dashboard?id=open-template-hub_web-ui-template)
Web UI Template is a modern, responsive, and customizable web UI template for your business. It contains reusable components, theme color, and design support along with dark theme support.
For demo click the image below ⬇️
## Ways to Begin
### 1. Express Deploy
Deploy this template to Heroku
[](https://heroku.com/deploy?template=https://github.com/open-template-hub/web-ui-template)
### 2. Start with UI Generator
Create your UI with UI Generator Package
[](https://www.npmjs.com/package/@open-template-hub/app-generator)
### 3. GitHub Template
Use this repository as a Template
[](https://github.com/open-template-hub/web-ui-template/generate)
## Installations
Install **nodejs** and **npm** via **[nodejs.org](https://nodejs.org)**.
Check installed versions of **nodejs** and **npm** via running following commands:
```
node -v
npm -v
```
## WebStorm Configurations
If you imported project into **WebStorm** you will see following run configurations:
### 1. Install
**[install.run.xml](.run/install.run.xml)**
### 2. Build
**[buildLocal.run.xml](.run/buildLocal.run.xml)**
**[buildLocalToStagingApi.run.xml](.run/buildLocalToStagingApi.run.xml)**
**[buildStaging.run.xml](.run/buildStaging.run.xml)**
**[buildProd.run.xml](.run/buildProd.run.xml)**
### 3. Start
**[startLocal.run.xml](.run/startLocal.run.xml)**
**[startLocalFromIPhone.run.xml](.run/startLocalFromIPhone.run.xml)**
**[startLocalToStagingApi.run.xml](.run/startLocalToStagingApi.run.xml)**
**[startLocalFromIPhoneToStagingApi.run.xml](.run/startLocalFromIPhoneToStagingApi.run.xml)**
**[startStaging.run.xml](.run/startStaging.run.xml)**
**[start.run.xml](.run/start.run.xml)**
### 4. Debug
**[debug.run.xml](.run/debug.run.xml)**
### 5. Dependency Management
**[outdated.run.xml](.run/outdated.run.xml)**
**[update.run.xml](.run/update.run.xml)**
## Local Deployment and Debug
In order to deploy and debug locally, run following configurations in order:
1. **[install.run.xml](.run/install.run.xml)**
2. **[buildLocal.run.xml](.run/buildLocal.run.xml)**
3. **startLocal**
1. **[startLocal.run.xml](.run/startLocal.run.xml) (uses local api)**
2. **[startLocalFromIPhone.run.xml](.run/startLocalFromIPhone.run.xml) (uses local api - accessible from iphone)**
3. **[startLocalToStagingApi.run.xml](.run/startLocalToStagingApi.run.xml) (uses staging api)**
4. **[startLocalFromIPhoneToStagingApi.run.xml](.run/startLocalFromIPhoneToStagingApi.run.xml) (uses staging api - accessible from iphone)**
4. **[debug.run.xml](.run/debug.run.xml)**
## Environment Variables
If you run **WebStorm**'s **[env.run.xml](.run/env.run.xml)** configuration you will see following variables generated in **.env** file. Set them appropriately.
```applescript
PORT=4201
```
Check project's current **nodejs** and **npm** version from **[package.json](package.json)**.
## Brand Color Scale Generator
To be able to generate brand color scales, we are using **[Colllor](http://colllor.com)**.
## Favicon Generation
To be able to generate favicon, refer to **[FAVICON_GENERATION.md](docs/FAVICON_GENERATION.md)** file.
## Cookie Policy Generation
To be able to generate cookie policy, use **[cookiepolicygenerator](https://www.cookiepolicygenerator.com)** site.
## Localization
To be able to generate or update localization, use [updateMessages.run.xml](.run/updateMessages.run.xml).
## Outdated
Refer to **[OUTDATED.md](docs/OUTDATED.md)** to see outdated npm packages and update them with your own risk.
## Contributors

Furkan Yavuz
💬 📖 👀

Fatih Turker
💬 📖 👀

Mert Sarac
💬 📖 👀
## Contributing
Refer to **[CONTRIBUTING.md](https://github.com/open-template-hub/.github/blob/master/docs/CONTRIBUTING.md)** to see how to contribute to Open Template Hub.
## Code of Conduct
Refer to **[CODE_OF_CONDUCT.md](https://github.com/open-template-hub/.github/blob/master/docs/CODE_OF_CONDUCT.md)** to see contributor covenant code of conduct.
## LICENSE
The source code for this project is released under the [MIT License](LICENSE).
