Git Product home page Git Product logo

library's Introduction

library

App to keep track of Books in the library.
Built by using Spring Boot and Ember.js
Check here:
https://prajun7.github.io/library/

To Start

  • Clone the project
  • For Frontend (VS code)
npm install
ember s
  • For backend (IntelliJ)
Build the project using Maven

Backend

  • Spring Boot
  • JPA
  • H2

Frontend

  • Ember.js

Deployment

Frontend - Using github pages

In config/environment.js file, the rootURL should be the repository-name in our case library.

module.exports = function(environment) {
 var ENV = {
   // ... other configurations ...

   // Update rootURL and locationType for GitHub Pages deployment
   rootURL: '/<repository-name>/', // Replace <repository-name> with your GitHub repository name
   locationType: 'hash'
 };

 // ... other configurations ...

 return ENV;
};

And need to add these options into ember-cli-build.js file:

    // Configure outputPaths
 app.options.outputPaths = {
   app: {
     html: 'index.html',
     css: '/assets/app.css',
     js: '/assets/app.js'
   },
   vendor: {
     css: '/assets/vendor.css',
     js: '/assets/vendor.js'
   }
 };

Check the config/environment.js file and ember-cli-build.js file in the main branch.

Ember is deployed using the guthub pages. Check the branch gh-pages-frontend.
To deploy a new project follow these steps:
Run ember build --environment=production in the main branch
This will generate the dist folder in the main branch.
Copy the contents of the dist folder like, assets folder, index.html to the gh-pages-frontend branch.
The assest, index.html and robots.txt should be the root file of that branch, that is they should not be inside any folder.

Backend - Using Heroku

We need to add system.properties file in the backend and need to specifiy the java version we are using. That is,

java.runtime.version=17

Check pom.xml file to see which Java versin you are using.

Check the heroku-backend branch
Only this branch is deployed for backend.


Ember 101

  • index.js in routes folder
  • index.js in controller folder
  • index.hbs in template folder

All of these files are connected. The name of the files should be same.

In index.js in route folder: It acts like useEffect with empty array. In this file we put the API call to the backend inside the model. And we return the data from the model. The route file is the singleton, that is, it only have one instance and only runs once when we go to that URL.

After this in, index.hbs file we can get that data by doing, this.model

If we want to have more methods in index.hbs method we will define with action or method into the index.js in controller folder.

When we call a component and pass the function or variable inside the component we can get that in the component by using, this.args.

library's People

Contributors

prajun7 avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.