If you haven’t installed Aikeedo locally yet, please refer to our Local Installation Guide first.
Prerequisites
Before we dive in, make sure you have the following tools installed on your machine:- PHP 8.2 or higher
- MySQL 8.0 or higher
- Node.js 18.x or higher
- npm 9.x or higher
These are the minimum required versions. We recommend using the latest LTS (Long Term Support) versions of Node.js and npm for the best performance and security.
- PHP: Visit the PHP installation guide
- MySQL: Check the MySQL installation page
- Node.js & npm: Download from the Node.js official website
Step 1: Configure Environment Settings
Let’s set up your environment for local development.-
In the Aikeedo root directory, locate the
.envfile. -
Open
.envin your favorite text editor and update the following settings: -
Save the
.envfile.
Step 2: Set Up Frontend Development
Aikeedo comes pre-built with all necessary frontend assets. However, for local development, you’ll need to start the Vite development server:- Open a terminal in the Aikeedo root directory.
-
Start the Vite development server:
Keep this terminal window open. It will display compilation errors and automatically update your browser when you make changes to frontend files.
Understanding the Asset Structure
Aikeedo organizes its assets into two main directories:-
/resources/assets: For files that need processing (e.g., JavaScript, SCSS).- Example:
/resources/assets/js/app/index.jsis the main JavaScript entry point. - Example:
/resources/assets/css/index.scsscontains the main styles.
- Example:
-
/resources/static: For files that should be copied as-is (e.g., images, fonts).- Example:
/resources/static/images/logo.pngwill be copied to/public/images/logo.png.
- Example:
Step 3: Start the Backend Server
Now, let’s get the PHP server running:- Open a new terminal window (keep the npm process running in the previous one).
- Navigate to the Aikeedo root directory.
-
Start the PHP server:
Step 4: Access Your Local Aikeedo Instance
Time to see your work in action!- Open your web browser.
- Navigate to
http://localhost:8000.
Development Workflow
Now that everything is set up, here’s your typical development workflow:-
Make changes to PHP files for backend modifications.
- Example: Edit
/src/Presentation/RequestHandlers/IndexRequestHandler.phpto modify the home page logic.
- Example: Edit
-
Edit files in
/resources/viewsfor frontend changes.- Example: Modify
/resources/views/templates/app/dashboard.twigto update the dashboard layout.
- Example: Modify
-
Add or modify static assets in
/resources/static.- Example: Add a new image at
/resources/static/images/new-feature.jpg.
- Example: Add a new image at
- Your browser will automatically reload for frontend changes thanks to HMR.
- Refresh your browser to see backend changes take effect.
Remember, this setup is for the core Aikeedo development. For theme-specific work, check out our Theme Development Guide.
Building for Production
When you’re ready to build your assets for production:- Open a terminal in the Aikeedo root directory.
- Run the build command:
- Create a
public/assetsdirectory with optimized files. - Copy static files from
/resources/staticto/public. - Update the asset manifest in
/public/.vite.
Troubleshooting
If you run into issues:- PHP errors: Check the PHP server console and your application’s error log file (typically found in the logs directory).
- Frontend build errors: Look at the npm/Vite console output.
- Database issues: Verify your
.envsettings and MySQL connection. - Missing assets: Ensure files are in the correct
/resourcessubdirectory.