A simple blog platform that uses Elasticsearch for fast search capabilities. Users can add blog posts and search them efficiently. The project integrates Tailwind CSS for a clean and modern UI.
-
Add Blog Posts: Create and store blog posts in Elasticsearch.
-
Search Blog Posts: Perform full-text search on blog titles and content.
-
Modern UI: Styled with Tailwind CSS.
blog-search/
├── public/ # Publicly accessible files
│ ├── index.php # Homepage linking to other pages
│ ├── post.php # Add blog post page
│ ├── search.php # Search blog posts page
│ ├── output.css # Tailwind CSS output file (auto-generated)
│ ├── styles.css # Tailwind CSS input file
│ ├── assets/ # Static assets folder
│ │ ├── images/ # Images folder (optional)
│ │ └── favicon.ico # Favicon (optional)
├── src/ # Source files for backend logic
│ ├── config.php # Configuration for Elasticsearch and SQLite
│ ├── functions.php # Helper functions for database and search
├── database/ # Database-related files
│ └── blog.sqlite # SQLite database file
├── node_modules/ # Node.js dependencies (auto-generated)
├── tailwind.config.js # Tailwind CSS configuration file
├── package.json # Node.js package configuration
├── package-lock.json # Node.js dependency lock file
├── composer.json # PHP dependencies file
├── composer.lock # PHP dependency lock file
-
PHP 7.4 or later
-
Elasticsearch 7.x or 8.x
-
Node.js 14.x or later
-
SQLite
- Step 1: Clone the Repository
git clone [blog-search](https://github.com/khouloudhaddad/blog-search.git)
cd blog-search
- Step 2: Install PHP Dependencies
composer install
- Step 3: Install Node.js Dependencies
npm install
- Step 4: Set Up Tailwind CSS
Generate the Tailwind CSS file:
npx tailwindcss -i ./public/styles.css -o ./public/output.css --watch
-
Step 5: Start Elasticsearch
Ensure Elasticsearch is running locally on http://localhost:9200.
-
Step 6: Start the PHP Server
Run the project locally:
php -S localhost:8000 -t public
-
Enter the title and content of the blog post.
-
Click "Add Post" to save it.
-
Enter a search query (e.g., keywords from the blog post).
-
View the results below the search bar.
- Get the Container Name First, ensure that your container is running:
docker ps
This will list all running containers. Look for the blog-search-app container or whatever name you've given your app's container.
- Enter the Running Container Next, you need to exec into the running blog-search-app container. Run the following:
docker exec -it blog-search-app bash
This will give you a shell inside the container.
- Run Tailwind CSS Build with npx Now, inside the container, you can run the Tailwind CSS build process:
npx tailwindcss -i ./public/styles.css -o ./public/output.css --watch
This should start watching for changes in your styles.css and output to output.css.
-
PHP: Backend logic.
-
Elasticsearch: Search engine.
-
SQLite: Lightweight database for storing blog metadata.
-
Tailwind CSS: Frontend styling.
-
Composer: PHP dependency management.
-
Node.js: For Tailwind CSS.
-
Add user authentication.
-
Implement pagination for search results.
-
Dockerize the application.
-
Add richer search features like filtering and sorting.
-
Deploy to a cloud platform.
This project is open-source and available under the MIT License.