Four bakery products for customers to select quantities
Fresh-Bakery — HTML Starter Template
By areyno20
Fresh-Bakery is a front-end page project for a fictional Toronto bakery. Users can choose quantities for four products and enter personal information, and the page then displays product costs, order total, preparation time and the distance to the store.
Explore the design
Compare the page layouts and mobile experience. Open any screenshot for a closer look.
Actual screenshot captured by the server browser.
All pages & views 2
Screenshots show visual appearance; interactive behavior may differ.
What stands out
A quick read of the recorded project description.
Displays product costs, order total and preparation time based on the information the customer enters
Uses the Google Maps API to calculate the distance between the customer and the store
Uses the Wikipedia API to retrieve information about pastry products
Uses Tailwind for page styling
Deployed as an online page via GitHub Pages
Template Details
Fresh-Bakery is a team course project that builds application pages for a fictional Toronto bakery. The README states that the page includes four products for customers to choose from, and the system displays product costs, order total, preparation time and the distance between the store and the customer's location based on the information the customer provides.
Interaction is handled in two ways: customers select product quantities, and they enter personal information in the order form, which is used to calculate distance. The project also requires the use of two APIs: the Google Maps API to calculate the distance between the user and the store, and the Wikipedia API to retrieve information about pastry products that customers may not be familiar with. Styling is done with Tailwind. The README does not document specific framework versions, build tools, backend services or data persistence methods, nor does it document the availability and limitations of these features in a production environment.
The project assigns tasks through GitHub issues and is ultimately deployed on GitHub Pages; the README provides the online page address and four page screenshots.
Is it right for your project?
Use Cases
- As a front-end course project, demonstrating form interaction and cost calculation logic
- Demonstrating integration of the Google Maps API and Wikipedia API in a page
- As an interface reference for a small bakery or food-service static page
- For practicing responsive page styling with Tailwind
Suitable For
- Developers learning front-end interaction and API calls
- Beginners who need a structural reference for a bakery or food-service page
- Students reviewing implementation approaches for course projects
Getting started & customization
Use these recorded setup notes alongside the repository instructions for your chosen version.
- 1
The README does not provide local installation, build or run steps; it only gives the GitHub Pages online address
- 2
The README mentions the use of the Google Maps API and Wikipedia API but does not document how to configure API keys
- 3
The README does not document dependency lists, build tools or backend service requirements
License & source material
Usage conditions & limitations
Free to use · keep license noticeThis listing covers the free version under the MIT license in the public repository; the free scope is the code of this version and does not mean external services or third-party assets are free.
Must comply with when using
- The code of this version may be used, modified, used commercially and distributed free of charge.
- When distributing copies or substantial portions of the code, the original author's copyright notice and the complete MIT license notice must be retained.
- The code is provided as is; warranties and limitations of liability are governed by the original license and applicable law.
Additional costs & items to verify
- Demo images, fonts, icons and other third-party assets must be checked against their respective licenses; the code's MIT license alone is not sufficient to determine this.
- External services such as domains, hosting, databases, payments or AI may incur separate charges.
- The page relies on the Google Maps API to calculate distance and the Wikipedia API to retrieve pastry information; using these features requires configuring the corresponding API access yourself (the README does not document how to configure keys).
- The README only provides the GitHub Pages online address and does not give local installation, build or run steps.
View Original Text Basis
Permission is hereby granted, free of charge
Original License Text
Another project requirement was to use two API's at some point in our code. In order to achive this tasks we decided to use the Google Maps API and the Wikipedia API. The Google Maps API was used to to carry out the calculations that tell the user how far they are from the store. The Wikipedia API was used to grab information about pastry products that customers may be unfamiliar with.
Original README
https://github.com/areyno20/Fresh-Bakery/blob/main/LICENSEhttps://github.com/areyno20/Fresh-Bakery/blob/main/README.mdDeployed page: https://areyno20.github.io/Fresh-Bakery/
Original README
Compiled by DeepSeek based on repository license and README ·2026-10-17. Results only cover the materials read; dependencies, images, fonts, and subsequent term changes are subject to their respective original texts.
Project checks & description sources
Template Information
- Source platforms
- GitHub
- Documentation and maintenance reference score
- Partly documented · 65 / 100
- Technologies
- HTML
- Website type
- Starter
How this score is calculated
Our heuristic uses license records (up to 30), a demo link (12), a preview (10), stars (15), recorded maintenance (15), description completeness (8), feature records (5) and classification data (5). It is not a code, security or performance test, or a Google score. A link does not establish tested functionality.
What to verify for this project
- Repository update recorded
- 2022-11-29
- Screenshot last checked
- 2026-10-17
A demo link is listed. Check it with your own content and viewport sizes; its presence does not confirm that forms, authentication or payments work.
The catalog identifies HTML as the primary stack. Check the actual dependency manifest and lockfile for versions and hosting requirements. These notes use recorded metadata, not a code audit or a deployment test.
Use a selection guide →How this description was prepared
AI-assisted description based on catalog records and repository material. Repository authors are not automatically the reviewers of this description.
Review declaration: codex-user-requested-batch-review-20261018 · 2026-10-18
Inspect the recorded source material
SHA-256: cdfd9bacc6c8b79c6453a72edf2db5b417cbad72f48c437f5b20b3d3a5e39bdf
2026-10-17T16:27:08.630Z
Source file / repository# Fresh Bakery ## Project Description For this project we decided as a team to make an app page for a bakery somewhere in Toronto. Our imaginery bakery has four products which the customer can select; the system will then use the imformation that the customer provides to display the cost of the products, the total cost of teheir order, time till their order is ready and the distance between the store and their location. One of the requiremnts for the project was to make the page interactive; we achieved this in two ways: 1) By allowing the customer pick the quantity of the products the would like. 2) By asking the customer to put in their personal information in the order form section so that the system can do the calculation for the distance between locations. Another project requirement was to use two API's at some point in our code. In order to achive this tasks we decided to use the Google Maps API and the Wikipedia API. The Google Maps API was used to to carry out the calculations that tell the user how far they are from the store. The Wikipedia API was used to grab information about pastry products that customers may be unfamiliar with. In order to achieve the CSS styling you see on the app, we found a style sheet called Tailwind, we decided to go with it because it was similar to bootstrap in terms of how easy it is to use. It was very useful in polishing our UI so as to be attractive to potential customers. We divided the tasks up by creating "issues" on GitHub so that we could keep track of what needed to be done and then who was in charge of doing what, this way two people would not be working on the same thing. Once everything was done we deployed the finished website as seen below: ## Live Website Deployed page: https://areyno20.github.io/Fresh-Bakery/ ## Screenshots    
Explore similar templates
Compare previews and descriptions within the same stack and category.

startbootstrap-simple-sidebar
A Bootstrap off-canvas sidebar navigation HTML starter template from Start Bootstrap. It provides directly editable HTML and CSS in the dist directory, while the source uses Pug, SCSS, and JavaScript with npm build scripts for live preview and compilation.
HTML · Starter

adminkit
AdminKit is a free, MIT-licensed HTML admin and dashboard template built on Bootstrap 5. The free version includes 15 demo pages, 1 plugin, and 1 color scheme, with hundreds of UI components, forms, tables, charts, and icons.
HTML · Admin dashboard

Landing-Page
A general-purpose landing page HTML template maintained by Tailwind Toolbox, written in pure HTML and loading the complete Tailwind CSS via CDN.
HTML · Corporate Website

light-bootstrap-dashboard
Light Bootstrap Dashboard is a free, MIT-licensed admin dashboard template from Creative Tim, built on Bootstrap with a responsive static HTML structure.
HTML · Admin dashboard

sing-app
Sing App Lite is a free, open-source admin dashboard template from Flatlogic, built with Bootstrap 4.5 and SCSS. It provides a responsive layout, dashboard examples, typography, tables, notifications, basic charts, icons, maps, and a hover sidebar, along with styled Bootstrap components.
HTML · Admin dashboard

startbootstrap-modern-business
Modern Business is a multipurpose Bootstrap full-site HTML template from Start Bootstrap with 17 standalone pages covering home, about, services, portfolio, pricing, blog, FAQ, and contact.
HTML · Starter
