Ionic 4: todo App + firebase

26 Creating and Configuring the App Building Mobile Apps with

section four building the project in this section we'll be building the project the to do application using ionic four and in this lesson we'll

start by creating a new ionic four application and then we'll configure that application to connect it to a new firebase project if you want you can use the firebase project that we have been

using in the last section or you can go ahead and create a new project if you are using the older firebase project make sure that you get rid of all the data that you have in your cloud file

store and firebase authentication so we'll start by creating a new ionic 4 application using the ionic CLI and for this I have created a new folder called final project and inside this folder

I'll use the ionic CLI to create a new ionic application it prompts me if I want to try ionic 4 and I'm going to say yes and you can see that a new folder called

to-do app is created in the final project folder and it contains all the files and folders of our new ionic project once this project is created will open this project folder in Visual

Studio code so here we are inside Visual Studio code and the first thing we'll do is install firebase in this ionic project so I'll just go ahead and type in npm install

firebase – – save this will install firebase and we'll also add an entry to the package dot JSON file now the fire base has been installed successfully we need to go to our AB dot

module or TS file and here we need to write the code to configure firebase we'll start by importing firebase so I'll just go ahead and type in import star as firebase from firebase next

we'll use the initializer app function from firebase to configure this application the initialize our function as we know takes in a JSON object and we can get that JSON object from the

firebase console so I'll switch to firebase console and here you can see that I'm using the older firebase project that I have been using for the last section I'll delete the user that I

have in firebase authentication and I'll also delete the collection that I have in the database section once I've deleted everything I'll go to the project overview section

click on hired firebase to web a button and copy this JSON object from here come back to Visual Studio code and paste in this JSON object the configuration is now complete but while we are added

we'll also add timestamp in snapshot setting for a file store so I'll just go ahead and type in firebase stored firestore dot settings and the settings function takes in a JSON object which

will contain only one key timestamps in snapshots and we'll set it to true let's save the file and now you can close your advert module or TS file that's all about configuring the new ionic

application to connect to firebase now that we have created this new ionic application and configured it to connect to firebase in the next lesson we are going to work on the user signup page