Typolino – Setting up the project

First things first. I try to document how I have setup my project. If you want to follow the steps for your own project, let’s first list what you need as a prerequisite:

  • Node (I have 10.15.3 installed)
  • A Firebase account (I think a Google account is sufficent and you will have it already – but not quite sure)

Install the tools

 npm install -g firebase-tools 
firebase –version to see if the installation was OK
npm install -g @angular/cli
verify Angular CLI works (ng –version)

Create the project

First of all the Angular project

ng new typolino
routing support & LESS

Connect to Firebase

First of all I created the project on the Firebase console. The main steps where to create the database and storage.

CD into the created project directory

cd typolino

Login into Firebase (follow the steps)

firebase login

Init the firebase project

firebase init
See the selected options

I chose the default on the next couple of questions..

I could have already set the proper path for the public directory. But I changed it later manually, it’s easy. Angular will by default compile it’s production build into dist/typolino. Therefore I had to change the public path in the firebase configuration file as follows:

Build and Deploy

The initial setup is done. To test it I ran a production build with Angular CLI and deployed the files to Firebase.

ng build --prod
firebase deploy
firebase open hosting:site

This should open the application in your favorite browser.

All fine, it seems to work.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.