Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/vanphudev/website_bachhoaxanh_clone
Project for the “Open Source Programming” course ** Technologies: PHP, Laravel 11 ** Instructor/ Mentor: Teacher Mrs Nguyen Hai Yen.
https://github.com/vanphudev/website_bachhoaxanh_clone
ajax blade css3 html5 jquery laravel laravel-framework mysql-database php
Last synced: 2 months ago
JSON representation
Project for the “Open Source Programming” course ** Technologies: PHP, Laravel 11 ** Instructor/ Mentor: Teacher Mrs Nguyen Hai Yen.
- Host: GitHub
- URL: https://github.com/vanphudev/website_bachhoaxanh_clone
- Owner: vanphudev
- Created: 2024-05-22T15:24:52.000Z (7 months ago)
- Default Branch: main
- Last Pushed: 2024-07-27T17:59:50.000Z (5 months ago)
- Last Synced: 2024-10-11T19:45:46.130Z (3 months ago)
- Topics: ajax, blade, css3, html5, jquery, laravel, laravel-framework, mysql-database, php
- Language: SCSS
- Homepage: https://github.com/vanphudev/website_bachhoaxanh_clone
- Size: 35.3 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## :rocket: Introduction
- **E-Commerce Website Development Project.**
- **Number members:** 2.
- **Duration:** March 2024 - May 2024.
- **Project name:** Website "Bach Hoa Xanh" Clone.
- **Project type:** Clone.
- **Description:** This project is a website clone of the "Bach Hoa Xanh" website. It is developed as a part of the "Open Source Programming course".
- **Members:**
- [Nguyen Van Phu](https://github.com/vanphudev) (Leader)
- [Nguyen Van Hoang](https://github.com/Hoang13052003) (Member)
- **Instructor/ Mentor:** Teacher Mrs Nguyen Hai Yen.
- **Course:** Open Source Programming.
- **University:** Ho Chi Minh City University Industry And Trade (HUIT).
- **Development tools:**
- **Results and Achievements:** Achieved an average score of 9/10 in “Open Source Programming”.
## :ledger: Index
- [About](#beginner-about)
- [Frontend](#open_file_folder-frontend)
- [Backend](#card_index_dividers-backend)
- [Tools and Technologies](#hammer_and_pick-Tools-and-Technologies)
- [Installation](#electric_plug-installation)
- [Development](#telescope-Development)
- [File Structure](#file_folder-File-Structure)
- [Branches](#cactus-Branches)
- [Gallery](#camera-Gallery)
- [Results and Achievements](#trophy-results-and-achievements)
- [Known Limitations](#warning-known-limitations)
## :beginner: About
- **Number members:** 2.
- **Duration:** March 2024 - May 2024.
- **Project name:** Website "Bach Hoa Xanh" Clone.
- **Description:** This project is a website clone of the "Bach Hoa Xanh" website. It is developed as a part of the "Open Source Programming course".
- **Instructor/ Mentor:** Teacher Mrs Nguyen Hai Yen.
- **Course:** Open Source Programming.
### :open_file_folder: Frontend:
- **Technologies Used**: HTML, CSS, JavaScript, jQuery, Ajax, Bootstrap, Slick, Fancybox, Sweetalert2.
- **Description**:
- Applied Slick for creating responsive carousels and sliders.
- Used Fancybox for displaying images and other content in a modal window.
- Implemented Sweetalert2 for enhanced alert and popup notifications.
### :card_index_dividers: Backend:
- **Technologies Used**: PHP, MySQL, Laravel 11, Datatables.
- **Description**:
- **MVC Architecture**: Utilizes the Model-View-Controller (MVC) architecture in conjunction with Laravel to develop the project. This approach separates data (Model), user interface (View), and business logic (Controller), facilitating maintainable and scalable code.
- **Database Management**: Employs MySQL for organizing and storing data, integrated with Laravel for efficient database management. Laravel provides tools for seamless database interactions, ensuring data integrity and efficient querying.
- **Core Features**:
- **Order Management**: Implements functionalities for order placement, including adding products to the cart, processing orders, and managing order history.
- **Product Management**: Develops features for managing products, including product filtering, category management, and promotional offers.
- **Full-Text Search**: Implements full-text search capabilities using MySQL and Laravel to enhance product search and retrieval.
- **Admin Panel**: Constructs an admin panel for managing products, categories, and customer information. Utilizes Datatables for displaying and managing data relationships in tabular format, supporting CRUD (Create, Read, Update, Delete) operations efficiently.
## :hammer_and_pick: Tools and Technologies
| Tools and Technologies | Description | Link Webstie |
| ---------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| JavaScript | JavaScript is a programming language that adds interactivity to your website. | 
|
| HTML5 | HTML5 is the latest version of Hypertext Markup Language, the code that describes web pages. | |
| CSS3 | CSS3 is the latest evolution of the Cascading Style Sheets language and aims at extending CSS2.1. | |
| Bootstrap 5 | Bootstrap is a free and open-source CSS framework directed at responsive, mobile-first front-end web development. | |
| Laravel 11 | Laravel is a free, open-source PHP web framework, created by Taylor Otwell and intended for the development of web applications following the model–view–controller architectural pattern. | |
| MySQL | MySQL is an open-source relational database management system. | |
| Slick | Slick is a responsive carousel jQuery plugin that supports multiple breakpoints, CSS3 transitions, touch events/swiping & much more. | |
| Fancybox | Fancybox is a tool that offers a nice and elegant way to add zooming functionality for images, html content, and multi-media on your webpages. | |
| Datatables | DataTables is a plug-in for the jQuery Javascript library. It is a highly flexible tool, based upon the foundations of progressive enhancement, and will add advanced interaction controls to any HTML table. | |
| Sweetalert2 | A beautiful, responsive, customizable, accessible (WAI-ARIA) replacement for JavaScript's popup boxes. | |
## :electric_plug: Installation
> [!IMPORTANT]\
> This is a group development project. You can clone the repository and set it up on your local machine for personal use and testing. We will not provide information for using this project. Thank you for following the project we have developed.
- **Here are the prerequisites for this project:**
- PHP >= 7.3
- Composer.
- MySQL.
- jQuery.
- Laravel 11
## :telescope: Development
> [!IMPORTANT]\
> This is a group development project. You can clone the repository and set it up on your local machine for personal use and testing. We will not provide information for using this project. Thank you for following the project we have developed.
- This is a group development project. You can clone the repository and set it up on your local machine for personal use and testing. We will not provide information for using this project. Thank you for following the project we have developed.
### :file_folder: File Structure
- Here is the project file structure along with a detailed explanation of each component.
```
DOAN_BACHHOAXANH_CLONE/
├── app/
│ ├── Helpers/
│ ├── Http/
│ ├── Models/
│ └── Providers/
├── bootstrap/
├── config/
├── database/
│ └── folderImages/
├── public/
├── resources/
├── routes/
├── storage/
├── tests/
├── vendor/
├── .editorconfig
├── .env
├── .env.example
├── .gitattributes
├── .gitignore
├── artisan
├── composer.json
├── composer.lock
├── package.json
├── phpunit.xml
├── README.md
└── vite.config.js
```
- **app/**: Contains the core application code.
- **Helpers/**: Custom helper functions.
- **Http/**: Controllers, middleware, and requests.
- **Models/**: Eloquent models.
- **Providers/**: Service providers.
- **bootstrap/**: Initializes the framework.
- **config/**: Configuration files.
- **database/**: Database migrations, seeders, and folder for images.
- **folderImages/**: Folder to store images.
- **public/**: Publicly accessible files.
- **resources/**: Views, assets, and language files.
- **routes/**: Route definitions.
- **storage/**: Compiled Blade templates, file-based sessions, file caches, and other files generated by the application.
- **tests/**: Test cases.
- **vendor/**: Composer dependencies.
- **.editorconfig**: Configuration for coding styles.
- **.env**: Environment variables.
- **.env.example**: Example environment variables file.
- **.gitattributes**: Git attributes.
- **.gitignore**: Specifies files and directories that should be ignored by Git.
- **artisan**: Laravel's command-line interface.
- **composer.json**: Composer dependencies and scripts.
- **composer.lock**: Locked versions of Composer dependencies.
- **package.json**: Node.js dependencies and scripts.
- **phpunit.xml**: PHPUnit configuration.
- **README.md**: Project documentation.
- **vite.config.js**: Vite configuration file.
### :cactus: Branches
- This project uses a single branch for team collaboration.
- **`main`** is the development and production branch.
## :camera: Gallery
- **Here are some demo images showcasing the results of the project:**
### :trophy: Results and Achievements
- **Average Score**: Achieved an average score of 9/10 in the “Open Source Programming” course, reflecting a strong understanding and application of open-source technologies.
- **Skills Development**: Enhanced skills in modern web technologies, including Laravel, MySQL, and front-end frameworks, through practical application and problem-solving in real-world scenarios.
## :warning: Known Limitations
While this project provides a functional clone of the "Bach Hoa Xanh" website, there are a few limitations and areas for improvement:
- **Not Responsive**: The current design does not fully support responsive layouts. Users may experience issues when accessing the website on different devices or screen sizes.
- **Lack of Online Payment Integration**: The project does not include functionality for online payment. Users can place orders, but payment must be handled manually or through alternative methods.
- **Interface Design**: The visual design of the interface is basic and may not be aesthetically pleasing. There is room for improvement in the overall look and feel of the website to enhance user experience.