Angular Blog Static Firebase Stackblitz themes template

themestemplate website themes website template angular template rent car firebase angularthemes jamstackthemes premiumthemes

Angular Webapp + Booking Form + Decap Headless CMS .

All in one angular technolog set for your car website project

Features: .

• Frontend Angular Technology
• Backend Decap Netlify Headless CMS
• Home Page
• About Page
• Angular Auto SEO injection by creativitas dev
  • Metatag
  • Twitter Card
  • Open Graph
  • Canoncial URL
• Car List Page
• Booking Form
• Booking Page
• Contact Page

Installation Angular Car .

• Need Download Node js , Download Now
• Open terminal and Install Angular CLI npm install -g @angular/cli
• Download Angular Source Code - Extract in to your project folder.
• Run Installation npm install
• Run Project ng serve
• Open Web Browser localhost:4200
• Open terminal again to run your backend CMS and run npx decap-server
• Access your admin page on localhost:4200/admin/index.html

Work With Backend Headless Decap Netlify CMS .

After you have run your project, you need to run headless cms server , run this command npx decap-server, Next Login in to your backend cms localhost:4200/admin/index.html

Angular Car Configuration .

Next we need to configure your site, access in to dashboard backend admin localhost:4200/admin/index.html , and select Configuration menu - now you can update setup your website. Insert your favion , url ,twitter , facebook for your SEO metatag, open graph and twitter card.

Update your booking form in to form area, Don't forget to add your email too.

For save you can press publish in header publish button - publish now.

Nav Menu .

To update nav menu, you can open on nav menu, and update nav name url link and others. To add new you can press add new nav menu button, and input your nav name and url link.

For save you can press publish in header publish button - publish now.

Footer Menu .

To update footer menu, you can access in to footer menu - and update footer nav, logo, and contact.

For save you can press publish in header publish button - publish now.

Content and Car Fleet Page .

After you have setup your site, and configure footer, nav menu, now you can update article.

Access in to dashboard headless cms angular car area.

• Home Page - Access on home page menu , and update your home page area.
• About Page - to update your about page.
• Car Page - to update your car page list
• Car Fleet - to update and create new your car fleet, if you want add new car , you can press + add new car button, and insert your detail car on this area.
• Booking Page - to update your booking page area.
• Contact Page - to update your contact page area.

Prepare Build Production .

After you have update your site, now you can make your site live, to do this you need to follow this step.

1. Open your dashboard backend cms - configuration - change your URL with your domain.
2. Change all canoncial url with your domain in all page, such home page, about , contact, booking, and car page,
3. Create Github Account.
4. Register on Netlify with your github account.

Change Backend CMS Configuration .

Now you need to update your backend cms configuration, to make your headless cms live too.

Open on your angular car source code project src/admin/config.yml

and now we need to change from this code

local_backend: true
backend:
  name: git-gateway
#  repo: githubuser/repo
#  branch: main 

to be

backend:
  name: git-gateway
  repo: githubuser/repo
  branch: main 

change githubuser with your github account name , and change repo with your project repo. and save it.

Make your angular car web app online .

Ok, now you can login in to github,create new repo, and push or upload your project in to your repo.

Next you can login in to netlify with your github account, and create new project, select github - and select your repo project - select angular as web tech and click deploy.

Auth Credential Setup Backend Headless CMS .

Now you can access on netlify identity, and activate gitgateway, and setup your register details, you can select github and google account. And change from open to be invite only. and save it.

Integration your domain .

Open in to your netlify project account,and you can add your domain , and use your netlify project.

Congratulation, now your angular car website app themes is live !!

Activate Booking Form .

Next step you need to activate your online booking system ,for first make sure you have setup your email for booking form in the configuration - email , access on yourfrontendsite/car select one car, and input in the booking form,and click book now button.

Now you can open your email, and you will received new email, and click activate, to activate your booking form system.

Thank You by using angular blog cms themes template project .

We hope with this source code you can build modern website blog for your project.

Project .

If you need develope custom website project, you can hire our team dev [https://www.hockeycomputindo.com/en/jamstack/](https://www.hockeycomputindo.com/en/jamstack