⚡ Angular Firebase CRUD

• Angular app to store fast-food orders in a Firebase database. They are then retrieved and shown in a table on-screen
• Note: to open web links in a new window use: ctrl+click on link

📚 General info

• Firebase backend stores customer name and number and what they ordered.

📷 Screenshots

• 

📶 Technologies

• Angular v16 javascript framework
• Angular Material Icons
• Materialize v1 front-end framework based on Material Design
• firebase v10

💾 Setup

• Install dependencies using npm i
• Add firebase credentials to environment.ts files
• Make sure Firestore Database rules will allow user access
• Run ng serve to get a server at http://localhost:4200/
• If required, run ng build to build the project. The build artifacts will be stored in the dist/ directory.

💻 Code Examples

• onSubmit function to get order data from form to createOrder function

onSubmit() {
    this.ordersService.form.value.order = this.order;
    let data = this.ordersService.form.value;
    console.log('data: ', data); // {CustomerName: Edward, orderNumber: 3, order: ["burger", "fries"]}

    this.ordersService.createOrder(data).then((res) => {
      console.log("fast food order created");
    });
  }

🆒 Features

• working Firebase backend Database storage of customer orders

📋 Status & To-Do List

• Status: Working
• To-Do: Improve: add quantity of items, clear form after use

👏 Inspiration

• Dayana Jabif of Angular Templates: Angular CRUD with Firebase

📁 License

• This project is licensed under the terms of the MIT license.

✉️ Contact

• Repo created by ABateman, email: gomezbateman@gmail.com