java-play-vue-seed project illustrates how Play Framework can be used to develop backend/services along with vue to develop the front-end/ui.
Read more @ http:https://bit.ly/2A1AzEq
-
Clone the application and open application as a sbt project.
-
This application is not using any of the java play views and all the views are served by the Vue code base which is inside the
uifolder. -
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)
sbt clean # Clear existing build files
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
sbt test # Run both backend and frontend unit tests
├── /app/ # The backend (java) application sources (controllers, models, views, assets)
├── /conf/ # Configurations files and other non-compiled resources (on classpath)
│ ├── application.conf # Builds the project from source to output(lib and bower) folder
│ ├── logback.xml # Logging configuration
│ └── routes # Routes definition
├── /logs/ # Logs folder
│ └── application.log # Default log file
├── /project/ # Sbt configuration files
│ ├── FrontendCommands.scala # Frontend build commands
│ ├── 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/ # Generated stuff
│ ├── /universal/ # Application packaging
│ └── /web/ # Compiled web assets
├── /test/ # Contains unit tests for java play sources
├── /ui/ # Vue front end sources
│ ├── /build/ # Webpack configs and dev server
│ ├── /config/ # Webpack configuration
│ ├── /node_modules/ # imported node modules
│ ├── /src/ # The frontend source code (modules, componensts, models, directives, services etc.) of the application
│ ├── /static/ # Static assets (images, dependencies loaded directly by html
│ ├── /test/ # Client side tests
│ ├── /.babelrc/ # Transpiler config
│ ├── .editorconfig # Define and maintain consistent coding styles between different editors and IDEs
│ ├── .eslintignore # Files to not lint
│ ├── .postcssrc # Post CSS config
│ ├── index.html # Page index
│ ├── package.json # Holds various metadata configuration relevant to the ui
│ ├── package-lock.json # Dependency version lock
│ └── README.md # Contains ui build command instructions├── .gitignore # Contains files to be ignored when pushing to git
├── build.sbt # Play application build script
├── LICENSE # Contains License Agreement file
├── README.md # Contains all user guide details for the application
└── ui-build.sbt # Associated frontend build scripts with sbt
- Represents available frontend build commands.
├── /project/
│ ├── FrontendCommands.scala
- Represents PlayRunHook scala implementation to trigger npm start with sbt run command.
├── /project/
│ ├── FrontendRunHook.scala
ui-build.sbtfile to represent UI builds scrips implementations to run along with the available sbt commands.- This file is located in the root level of the project to work smoothly with the
build.sbtfile.
- Added several new npm run commands in the
scriptssection of the package.json file in order to work smoothly with the sbt commands. - Check UI README.md to see the available front end build tasks.
├── /ui/
│ ├── package.json
├── /conf/
│ ├── routes
- 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.
GET / controllers.Assets.at(path="/public", file="index.html")
- THe following asset route is being used to serve all the build artifacts (css, js) and static files (images, etc.). This should be placed as the last route in route config file.
GET /*file controllers.Assets.at(path="/public", file)
Note: On production build all the front end Vue build artifacts will be copied to the public folder.
- Simply replace the ui directory with the build of your choice
- Make output directory ROOT/public/
- Implement a proxy to localhost:9000
- Scala Play React Seed
- Scala Play Angular Seed
- Java Play Angular Seed
- Scala Play Vuejs Seed by Duncan Nevin
- Java Play Vuejs Seed by Duncan Nevin
 Yohan Gomez |
 Lahiru Jayamanna |
 Gayan Attygalla |
 Duncan Nevin |
|---|
This software is licensed under the MIT license