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
We recommend using a version manager like nvm for Node.js, which allows you to easily switch between different Node.js versions.
Step 1: Configure Environment Settings
Let’s set up your environment for local development.-
In the Aikeedo root directory, locate the
.env
file. -
Open
.env
in your favorite text editor and update the following settings: -
Save the
.env
file.
These settings enable development mode, turn on debugging, activate Hot Module Replacement (HMR) for frontend development, and disable caching. This configuration helps you catch errors quickly and see your changes in real-time.
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.
Since Aikeedo is pre-built, you typically don’t need to run
npm install
or composer install
. The necessary dependencies are already included in the package.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.js
is the main JavaScript entry point. - Example:
/resources/assets/css/index.scss
contains the main styles.
- Example:
-
/resources/static
: For files that should be copied as-is (e.g., images, fonts).- Example:
/resources/static/images/logo.png
will be copied to/public/images/logo.png
.
- Example:
When adding new assets:
- Put files that need compilation (JS, CSS) in
/resources/assets
. - Place static files (images, fonts) in
/resources/static
.
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
.
If you don’t see the page or encounter errors:
- Ensure both the Vite (npm) and PHP servers are running without errors.
- Check that your
.env
file is correctly configured. - Verify that your database settings are correct and the database is accessible.
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.php
to modify the home page logic.
- Example: Edit
-
Edit files in
/resources/views
for frontend changes.- Example: Modify
/resources/views/templates/app/dashboard.twig
to 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/assets
directory with optimized files. - Copy static files from
/resources/static
to/public
. - Update the asset manifest in
/public/.vite
.
Avoid adding built files to your Git repository. Instead, include the build process in your deployment workflow.
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
.env
settings and MySQL connection. - Missing assets: Ensure files are in the correct
/resources
subdirectory.