From design to deployment with Firebase and Angular

1,107.00  inc. VAT

Start: December 3, 2018 Finish: 9:00 am - 5:00 pm

From design to deployment with Firebase and Angular #1



PLN 900 + VAT  | 3.12.2018, Warsaw, Poland

Perfect your technical skills. Enroll to the Tech Master Class @ FRONTEND CON 2018.  Choose your favorite trainer & subject.

Workshop ticket includes:

  • 1 full-day (8h) of engaging tech workshop
  • Access to a ton of useful information & real-world examples presented by knowledgeable instructors
  • All inclusive catering – lunch & coffee breaks

* ticket don’t include conference pass!

From design to deployment with Firebase and Angular

The participants of this workshop will work hands on with Firebase in an Angular application. They will walk along a journey of designing an app, setting out data requirements, and then putting these things into practice with Angular and the magic of Firebase. At the end of this workshop, each participant will have created and deployed a web application.

Firebase acts as a backend as a service and takes care of real time synchronization across apps and platforms. The participants will learn about and use the main Firebase modules needed to develop a simple social application. They will use Authentication, the Cloud Firestore and Firebase hosting.

Best practices about application planning will be discussed, like structuring the data in the API and decisions that need to be made in advance. We will also check our application against the Audits of the Lighthouse tool.

The workshop needs prior knowledge of web development. Some basic Angular experience is preferable, but not essential. No prior knowledge of Firebase is needed. The users will need a web-development-friendly laptop.

Your Trainer: Katerina Skroumpelou, Angular GDE, Software Engineer @ ThisDot

Katerina is a Angular GDE and Software Engineer @ ThisDot. In the past she worked with web maps at the National Centre for Scientific Research “Demokritos”. In her free time she is all web, speaking at conferences, experimenting with web maps and co-organizing the AngularAthens meetup. She likes to mix and match web technologies. Before diving into web development, she studied Architectural Engineering and Spatial Analysis at UCL. She is indigenous to the internet, and she loves web development. So much that she does not understand the distinction between work and life sometimes. Or so her friends say. She lives with her Maine Coon in Athens, Greece.

Agenda with the most important points

  1. Introductions – brief outline – demo (what is Firebase, why we use Angular)
  2. Drafting out our application
    1. General app scenario presentation (we will develop a simple chat application with user profiles available for each user)
    2. Designing the application – Setting out requirements
    3. Creating mock outlines
  3. Set-up (getting the laptops ready for development)
  4. Create a new angular app with the Angular CLI
  5. Setting up firebase
    1. Getting familiar with the firebase console
    2. Installing angularfire2
    3. Setting up firebase in our Angular app
  6. Laying out our application
    1. Authentication
    2. Read-Write rules
  7. Creating our app’s core components (menu, buttons, different screens)
  8. Creating our data
  9. Fetching our first data (using rxjs, we create an Observable and we subscribe to changes)
  10. Creating our chat messages components
  11. Extra: Viewing user profiles
  12. Deployment to GitHub pages

Target audienceThis workshop is targeted to web developers who want to learn how to use Firebase, or who want to see how they can benefit from the use of Firebase. Firebase is a very powerful tool that can give your app a cloud infrastructure (and of course all the support for a mobile app one may need). So, if you, your team, your next project or your next product need a painless cloud database with seamless synchronization, this workshop is for you. It is, also, for those who wish to be introduced to the magic, even though they may not need it yet.

No prior knowledge of Firebase is required. It might be good if you are familiar with Angular or its core concepts. If you’re not, it’s ok. We’ll take it step by step.


  • One laptop, which is preferably web development friendly (has nodejs, npm and git installed). That would save us time from the set up. However, there is time dedicated to getting everyone’s environments ready, so don’t worry too much.
  • A Google account. This will be needed to log in to the Firebase console.
  • Good spirits and a helpful attitude

Level: Beginner-Intermediate
Bring your own device.