|
| 1 | +[![MIT License][license-badge]][LICENSE] |
| 2 | + |
| 3 | +# scala-play-react-seed |
| 4 | + |
| 5 | +> scala-play-angular-seed project illustrates how Play Framework can be used to develop backend/services along with Angular to develop the front-end/ui. |
| 6 | +
|
| 7 | +Read more @ http://bit.ly/2AStvhK |
| 8 | + |
| 9 | +## Used Versions |
| 10 | + |
| 11 | +* [Play Framework: 2.6.7](https://www.playframework.com/documentation/2.6.x/Home) |
| 12 | +* [Angular: 5.0.0](https://angular.io/) |
| 13 | +* [Angular CLI: 1.6.0](https://cli.angular.io/) |
| 14 | + |
| 15 | +## How to use it? |
| 16 | + |
| 17 | +### Let's get started, |
| 18 | + |
| 19 | +* Clone the application and open application as a sbt project. |
| 20 | + |
| 21 | +* This application is not using any of the scala play views and all the views are served by the [Angular](https://angular.io/) code base which is inside the `ui` folder. |
| 22 | + |
| 23 | +* Used any of the sbt commands listed in the below according to the requirement which are working fine with this application.(To see more details of [sbt](http://www.scala-sbt.org/)) |
| 24 | + |
| 25 | +``` |
| 26 | + sbt clean # Clear existing build files |
| 27 | + |
| 28 | + sbt stage # Build your application from your project’s source directory |
| 29 | + |
| 30 | + sbt run # Run both backend and frontend builds in watch mode |
| 31 | + |
| 32 | + sbt dist # Build both backend and frontend sources into a single distribution |
| 33 | + |
| 34 | + sbt test # Run both backend and frontend unit tests |
| 35 | +``` |
| 36 | + |
| 37 | +## Complete Directory Layout |
| 38 | + |
| 39 | +``` |
| 40 | +├── /app/ # The backend (scala) application sources (controllers, models, views, assets) |
| 41 | +├── /conf/ # Configurations files and other non-compiled resources (on classpath) |
| 42 | +│ ├── application.conf # Builds the project from source to output(lib and bower) folder |
| 43 | +│ ├── logback.xml # Logging configuration |
| 44 | +│ └── routes # Routes definition |
| 45 | +├── /logs/ # Logs folder |
| 46 | +│ └── application.log # Default log file |
| 47 | +├── /project/ # Sbt configuration files |
| 48 | +│ ├── FrontendCommands.scala # Frontend build commands |
| 49 | +│ ├── FrontendRunHook.scala # Frontend build play run hook |
| 50 | +│ ├── build.properties # Marker for sbt project |
| 51 | +│ └── plugins.sbt # Sbt plugins declaration |
| 52 | +├── /public/ # Public assets |
| 53 | +│ └── /ui/ # Frontend build assests |
| 54 | +├── /target/ # Generated stuff |
| 55 | +│ ├── /universal/ # Application packaging |
| 56 | +│ └── /web/ # Compiled web assets |
| 57 | +├── /test/ # Contains unit tests for scala play sources |
| 58 | +├── /ui/ # Angular front end sources |
| 59 | +│ ├── /e2e/ # End to end tests folder |
| 60 | +│ ├── /node_modules/ # 3rd-party frontend libraries and utilities |
| 61 | +│ ├── /src/ # The frontend source code (modules, componensts, models, directives, services etc.) of the application |
| 62 | +│ ├── .angular-cli.json # Builds the project from source to output(lib and bower) folder |
| 63 | +│ ├── .editorconfig # Define and maintain consistent coding styles between different editors and IDEs |
| 64 | +│ ├── .gitignore # Contains ui files to be ignored when pushing to git |
| 65 | +│ ├── karma.conf.js # Karma configuration file |
| 66 | +│ ├── package.json # Holds various metadata configuration relevant to the ui |
| 67 | +│ ├── protractor.conf.js # Protractor configuration file |
| 68 | +│ ├── proxy.conf.json # UI proxy configuration |
| 69 | +│ ├── README.md # Contains all user guide details for the ui |
| 70 | +│ ├── tsconfig.json # Contains typescript compiler options |
| 71 | +│ └── tslint.json # Lint rules for the ui |
| 72 | +├── .gitignore # Contains files to be ignored when pushing to git |
| 73 | +├── build.sbt # Play application build script |
| 74 | +├── LICENSE # Contains License Agreement file |
| 75 | +├── README.md # Contains all user guide details for the application |
| 76 | +└── ui-build.sbt # UI build scripts |
| 77 | +``` |
| 78 | + |
| 79 | +## What is new in here? |
| 80 | + |
| 81 | +### FrontendCommands.scala |
| 82 | + |
| 83 | +* Represents available frontend build commands. |
| 84 | + |
| 85 | +``` |
| 86 | + ├── /project/ |
| 87 | + │ ├── FrontendCommands.scala |
| 88 | +``` |
| 89 | + |
| 90 | +### FrontendRunHook.scala |
| 91 | + |
| 92 | +* Represents PlayRunHook scala implementation to trigger angular serve with sbt run command. |
| 93 | + |
| 94 | +``` |
| 95 | + ├── /project/ |
| 96 | + │ ├── FrontendRunHook.scala |
| 97 | +``` |
| 98 | + |
| 99 | +### ui-build.sbt |
| 100 | + |
| 101 | +* `ui-build.sbt` file to represent UI builds scrips implementations to run along with the available sbt commands. |
| 102 | +* This file is located in the root level of the project to work smoothly with the `build.sbt` file. |
| 103 | + |
| 104 | +### npm run commands |
| 105 | + |
| 106 | +* Added several new npm run commands in the `scripts` section of the package.json file in order to work smoothly with the sbt commands. |
| 107 | +* Check [UI README.md](./ui/README.md) to see the available front end build tasks. |
| 108 | + |
| 109 | +``` |
| 110 | +├── /ui/ |
| 111 | +│ ├── package.json |
| 112 | +``` |
| 113 | + |
| 114 | +### proxy.conf.json |
| 115 | + |
| 116 | +* Contains proxy configurations required to run application in watch mode along with both `Scala` and `Angular` builds. |
| 117 | + |
| 118 | +``` |
| 119 | +├── /ui/ |
| 120 | +│ ├── proxy.conf.json |
| 121 | +``` |
| 122 | + |
| 123 | +## Routes |
| 124 | + |
| 125 | +``` |
| 126 | +├── /conf/ |
| 127 | +│ ├── routes |
| 128 | +``` |
| 129 | + |
| 130 | +* The following route configuration allows to map front end index.html to index route. This should be placed as the first route in this file. |
| 131 | + |
| 132 | +``` |
| 133 | +GET / controllers.Assets.at(path="/public/ui", file="index.html") |
| 134 | +``` |
| 135 | + |
| 136 | +**Note: _On production build all the front end Angular build artifacts will be copied to the `public/ui` folder._** |
| 137 | + |
| 138 | +## Contributors |
| 139 | + |
| 140 | +<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section --> |
| 141 | +|[<img src="https://avatars2.githubusercontent.com/u/5279079?s=400&v=4" width="100px;"/><br /><sub>Yohan Gomez</sub>][yohan-profile]| [<img src="https://avatars2.githubusercontent.com/u/6312524?s=400&u=efc9267c6f903c379fafaaf7b3b0d9a939474c01&v=4" width="100px;"/><br /><sub>Lahiru Jayamanna</sub>][lahiru-profile]<br />| [<img src="https://avatars0.githubusercontent.com/u/3881403?s=400&v=4" width="100px;"/><br /><sub>Gayan Attygalla</sub>](https://github.com/Arty26)| [<img src="https://avatars0.githubusercontent.com/u/24251976?s=400&v=4" width="100px;"/><br /><sub>Anuradha Gunasekara</sub>][anuradha-profile]| |
| 142 | +| :---: | :---: | :---: | :---: | |
| 143 | +<!-- ALL-CONTRIBUTORS-LIST:END --> |
| 144 | + |
| 145 | +## License |
| 146 | + |
| 147 | +This software is licensed under the MIT license |
| 148 | + |
| 149 | +[license-badge]: http://img.shields.io/badge/license-MIT-blue.svg?style=flat |
| 150 | +[license]: https://github.com/yohangz/scala-play-angular-seed/blob/master/LICENSE |
| 151 | + |
| 152 | +[yohan-profile]: https://github.com/yohangz |
| 153 | +[lahiru-profile]: https://github.com/lahiruz |
| 154 | +[gayan-profile]: https://github.com/Arty26 |
| 155 | +[anuradha-profile]: https://github.com/sanuradhag |
0 commit comments