Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/adibro500/adibros-home
https://github.com/adibro500/adibros-home
Last synced: 25 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/adibro500/adibros-home
- Owner: adibro500
- License: mit
- Created: 2019-05-26T07:26:59.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2023-01-07T05:48:05.000Z (about 2 years ago)
- Last Synced: 2024-11-08T17:53:13.366Z (3 months ago)
- Language: TypeScript
- Size: 3.91 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 24
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
[![MIT License][license-badge]][LICENSE]
# Scala Play Angular Seed
> Use play framework to develop the web application backend/services and frontend using Angular CLI, all in a totally integrated workflow and single unified console. This approach will deliver perfect development experience without CORS hassle.
Read more @ http://bit.ly/2AStvhK
[](http://bit.ly/2AStvhK)
## Used Summary
* [Play Framework: 2.7.0](https://www.playframework.com/documentation/2.7.x/Home)
* [Angular: 7.x.x](https://angular.io/)
* [Angular CLI: 7.1.4](https://cli.angular.io/)
## How to use it?
### Prerequisites
* [Node.js](https://nodejs.org/)
* [JDK](http://www.oracle.com/technetwork/java/javase/downloads/index.html)
* [scala](https://www.scala-lang.org/download/)
### Let's get started,
* Fork or clone this repository.
* Used any of the following [SBT](http://www.scala-sbt.org/) commands which will intern trigger frontend associated npm scripts.
```
sbt clean # Clean existing build artifacts
sbt stage # Build your application from your project’s source directory
sbt run # Run both backend and frontend builds in watch mode
sbt dist # Build both backend and frontend sources into a single distribution artifact
sbt test # Run both backend and frontend unit tests
```
* This seed is not using [scala play views](https://www.playframework.com/documentation/2.6.x/ScalaTemplates). All the views and frontend associated routes are served via [Angular](https://angular.io/) code base under `ui` directory.
## Complete Directory Layout
```
├── /app/ # The backend source (controllers, models, services)
│ └── /controllers/ # Backend controllers
│ └── FrontendController.scala # Asset controller wrapper serving frontend assets and artifacts
├── /conf/ # Configurations files and other non-compiled resources (on classpath)
│ ├── application.conf # Play application configuratiion file.
│ ├── logback.xml # Logging configuration
│ └── routes # Routes definition file
├── /logs/ # Log directory
│ └── application.log # Application log file
├── /project/ # Contains project build configuration and plugins
│ ├── FrontendCommands.scala # Frontend build command mapping configuration
│ ├── FrontendRunHook.scala # Forntend build PlayRunHook (trigger frontend serve on sbt run)
│ ├── build.properties # Marker for sbt project
│ └── plugins.sbt # SBT plugins declaration
├── /public/ # Frontend build artifacts will be copied to this directory
├── /target/ # Play project build artifact directory
│ ├── /universal/ # Application packaging
│ └── /web/ # Compiled web assets
├── /test/ # Contains unit tests of backend sources
├── /ui/ # React frontend source (based on Create React App)
│ ├── /e2e/ # End to end tests folder
│ ├── /node_modules/ # 3rd-party frontend libraries and utilities
│ ├── /src/ # The frontend source code (modules, componensts, models, directives, services etc.) of the application
│ │ ├── karma.conf.js # Karma configuration file
│ │ └── proxy.conf.json # UI proxy configuration
│ ├── .angular.json # Angular CLI configuration
│ ├── .editorconfig # Define and maintain consistent coding styles between different editors and IDEs
│ ├── .gitignore # Contains ui files to be ignored when pushing to git
│ ├── package.json # NPM package configuration.
│ ├── README.md # Contains all user guide details for the ui
│ ├── tsconfig.json # Contains typescript compiler options
│ └── tslint.json # Lint rules for the ui
├── .gitignore # Contains files to be ignored when pushing to git
├── build.sbt # Play application SBT configuration
├── LICENSE # License Agreement file
├── README.md # Application user guide
└── ui-build.sbt # SBT command hooks associated with frontend npm scripts
```
## What is new in here?
### FrontendCommands.scala
* Frontend build command mapping configuration.
```
├── /project/
│ ├── FrontendCommands.scala
```
### FrontendRunHook.scala
* PlayRunHook implementation to trigger ``npm run start`` on ``sbt run``.
```
├── /project/
│ ├── FrontendRunHook.scala
```
### FrontendController.scala
* Asset controller wrapper serving frontend assets and artifacts.
```
├── /app/
│ └── /controllers/
│ └── FrontendController.scala
```
### ui-build.sbt
* This file contains the build task hooks to trigger frontend npm scripts on sbt command execution.
### npm scripts
* New and modified npm scripts of [Angular CLI](https://cli.angular.io/) generated package.json.
* Check [UI README.md](./ui/README.md) to see all available frontend build tasks.
```
├── /ui/
│ ├── package.json
```
### proxy.conf.json
* Used to proxy play backend API when running the project on watch mode.
```
├── /ui/
│ ├── proxy.conf.json
```
## Routes
```
├── /conf/
│ ├── routes
```
* The following route configuration map index.html to entry route (root). This should be placed as the initial route.
```
GET / controllers.FrontendController.index()
```
* All API routes should be prefixed with API prefix defined under ``application.conf`` (Default prefix ``apiPrefix = "api"``)
Example API route:
```
GET /api/summary controllers.HomeController.appSummary
```
* The following route is being used to serve frontend associated build artifacts (css, js) and static assets (images, etc.). This should be placed as the final route.
```
GET /*file controllers.FrontendController.assetOrDefault(file)
```
**Note: _On production build all the front end Angular build artifacts will be copied to the `public/ui` folder._**
## Can be used to implement any front end/ui build!
* Simply replace the ui directory with the build of your choice
* Make output directory ROOT/public/
* Implement a proxy to localhost:9000
## Looking for some other frontend framework or language choice
* [Java Play Angular Seed](https://github.com/yohangz/java-play-angular-seed)
* [Scala Play React Seed](https://github.com/yohangz/scala-play-react-seed)
* [Java Play React Seed](https://github.com/yohangz/java-play-react-seed)
* [Scala Play Vuejs Seed](https://github.com/duncannevin/scala-play-vue-seed) by [Duncan Nevin](https://github.com/duncannevin)
* [Java Play Vuejs Seed](https://github.com/duncannevin/java-play-vue-seed) by [Duncan Nevin](https://github.com/duncannevin)
## Contributors
|[
Yohan Gomez][yohan-profile]| [
Lahiru Jayamanna][lahiru-profile]
| [
Gayan Attygalla](https://github.com/Arty26)| [
Anuradha Gunasekara][anuradha-profile]|
| :---: | :---: | :---: | :---: |
## License
This software is licensed under the MIT license
[license-badge]: http://img.shields.io/badge/license-MIT-blue.svg?style=flat
[license]: https://github.com/yohangz/scala-play-angular-seed/blob/master/LICENSE
[yohan-profile]: https://github.com/yohangz
[lahiru-profile]: https://github.com/lahiruz
[gayan-profile]: https://github.com/Arty26
[anuradha-profile]: https://github.com/sanuradhag