Loading...
Loading...
Loading...
Loading...
Your project this week is TBC
Learners will develop an end-to-end dynamic e-commerce web application where users can browse and purchase products online.
The frontend of this project will be built using React. For the backend, it will use Node.js and Express to handle server-side functionality. User accounts and product data will be stored in a SQLite database.
Your project for the next week will be to develop a Express backend connected to a SQLite database and linked to a React frontend. Your UI should provide methods so that users can search for and display information about items and add them to a shopping cart. It is up to you to determine the process and order you take to achieve this, but should plan this carefully and attempt to anticipate any hurdles you approach will encounter.
Before you start writing features you need to design the schema for your data. Think about what different things your app needs to store, how they relate to each other, and how you can avoid duplicating information. Record your schema in your README.md using Markdown tables. Consider embedding a diagram to help visualise the relationships.
What kinds of data relationships are there?
What’s a foreign key? How can they help us design schemas with relational data?
As a shopper, I want to:
See a homepage with content when I log in
Be able to navigate between different pages of the app
View a list of products when I visit the products page
Click on a product to view more details in a new page
Search for products by name or description and view product listings with images, descriptions and reviews
Add products to a shopping cart
View and edit items in my shopping cart
Complete the checkout process to "purchase" products in my cart
See confirmation when an order is placed successfully
View previous orders and order history
Complete checkout and payments to simulate purchasing products
Please name your repo following this template: PRO04_Name1_Name2_Name3_Name4
This week focuses on building a dynamic e-commerce web application, integrating React for the frontend with a Node.js/Express backend and SQLite database. The emphasis is on creating a full-stack application with database integration and state management in React.
Finalise previous courses
Database schema design and normalization
SQLite database management and querying
SQL syntax, focusing on SELECT and INSERT queries
Implementing CRUD operations in a web application
React component design and state management
Building responsive and dynamic user interfaces with React
Integrating backend APIs with React frontend
Managing relational data in web applications
Security considerations in database design and querying (e.g., SQL injection prevention)
Develop an e-commerce web application with the following features:
Design and implement a SQLite database schema for products, orders, and users
Create a React frontend that communicates with an Express backend
Implement CRUD operations for products and orders
Ensure proper state management for the shopping cart functionality
Database relationship modeling (one-to-many, many-to-many)
Using foreign keys in relational databases
Optimizing database queries for performance
Implementing search functionality in both frontend and backend
Error handling and data validation in full-stack applications
SQL | W3Schools W3Schools have lots of clear simple example for different types of SQL queries
Databases: how they work, and a brief history Amazing summary of the history of databases, what they are, how they work and the different types
SQL Injection | W3Schools Summary of one of the most common ways web apps get hacked
Express SQLite example An example of how you might structure a project using Express & SQlite