Wolfs Burger - Restaurant And Food CMS

This is a complete and self-manageable website solution, perfect for restaurants, cafes, and any food business. It features a modern frontend built with React (Vite + TailwindCSS) and a powerful backend powered by PHP and MySQL, allowing you to manage your entire content from a secure admin panel. Give your clients a professional and easy-to-use tool to manage their online presence without technical knowledge. The admin panel allows full control over products, categories, homepage content, site colors, and general settings.

Features

Full Admin DashboardComplete Product Management (Create, Edit, Delete)Multiple Image Uploads per ProductCategory Management with Drag & Drop ReorderingFeatured Products SystemFull Homepage Customization (Slider Images & Hero Text)Site-wide Color Scheme Customization from Admin PanelGeneral Settings Management (Logo, Contact, Social Media, Google Maps)Admin User Management (for Superadmin role)Built with modern technologies: React, Vite, and TailwindCSSSecure PHP & MySQL backend with a RESTful API

Requirements

PHP Version: 8.0 or higherDatabase: MySQL or MariaDBPHP Extensions: mysqli, jsonWeb Server: Apache or Nginx with mod_rewrite enabled

Instructions

Wolf's Burger - Website Template

1. Introduction

Thank you for purchasing the Wolf's Burger website template! This is a complete and self-manageable website solution, perfect for restaurants, cafes, and food businesses. It features a modern frontend built with React (Vite + TailwindCSS) and a powerful backend powered by PHP and MySQL.

2. Requirements

Server Requirements:

• PHP Version: 8.0 or higher
• Database: MySQL or MariaDB
• Web Server: Apache or Nginx

Local Machine Requirements (for setup):

• Node.js and npm: Required to compile the project after changing the API URL.

3. Installation Guide

Important: This template requires familiarity with command-line tools (npm) to configure and build the project.

Step 1: Upload Backend Files

Unzip the main package. Upload the contents of the /api folder to your server (e.g., inside public_html).

Step 2: Create and Import Database

Create a new database and user in your hosting panel. Then, using phpMyAdmin, import the database.sql file into your new database.

Step 3: Configure Database Connection

On your server, open the api/db_connection.php file and fill in your database details.

define('DB_USER', 'your_database_user');     // <-- CHANGE THIS
define('DB_PASS', 'your_database_password');  // <-- CHANGE THIS
define('DB_NAME', 'your_database_name');      // <-- CHANGE THIS

Step 4: Configure API URL in Source Code

This is the most important step. You must edit the source code to point to your API URL.

1. Unzip the /source-code folder on your local computer.
2. Open the folder in a code editor like VS Code.
3. You must change the hardcoded API URL in the following ###strong/strong###:
   • src/contexts/AuthContext.jsx
   • src/contexts/DataContext.jsx
   • src/pages/admin/AdminLogin.jsx
4. In each file, find the URL <a href="https://alejandrosabater.com.ar/api">https://alejandrosabater.com.a...</a> and replace it with the URL to your own API folder (e.g., <a href="https://yourdomain.com/api">https://yourdomain.com/api</a>).

Step 5: Build The Project

After saving your changes, you need to build the project.

1. Open a terminal in the /source-code directory.
2. Run the command to install dependencies:

   npm install
   
   
   
   

3. Now, run the command to build the files for production:

   npm run build
   
   
   
   

   ###listrong###

Step 6: Upload Frontend Files

Upload the contents of the newly generated /dist folder to your server, in the same location as your /api folder.

Step 7: Access Your Site

Your website should now be live and connected to your API. Default admin login: <a href="https://yourdomain.com/admin/login">https://yourdomain.com/admin/l...</a>

• Email: admin@wolfs.com
• Password: admin123

4. Admin Panel Usage

The admin panel allows you to manage all aspects of your site, including products, categories, homepage content, colors, and general settings.

5. Credits & Support

If you have any issues, please contact me through the support section on the Codester item page.