/x-clone

x(twitter) clone

Primary LanguagePHP

Laravel with Vue 2 Twitter Clone

This project combines Laravel as the backend framework with an external Vue 2 project for the frontend. Follow the instructions below to set up and run the project.

Prerequisites

Getting Started

  1. Clone the repository:

    git https://github.com/imsat/x-clone.git
    
  2. Install Laravel dependencies:

    composer install
    
  3. Install Laravel dependencies:

    cp .env.example .env
    
  4. Update the database configuration in the .env file:

    DB_CONNECTION=mysql
    DB_HOST=your_database_host
    DB_PORT=your_database_port
    DB_DATABASE=your_database_name
    DB_USERNAME=your_database_username
    DB_PASSWORD=your_database_password
    
  5. Generate the application key:

    php artisan key:generate
    php artisan jwt:secret
    
  6. Run database migrations and seed data:

    php artisan migrate --seed
    
  7. Install Node.js dependencies for the Vue 2 project:

    cd frontend
    cp .env.example .env
    npm install 
    

Running the Application

  1. Run the Laravel development server:
    php artisan serve 
    

Now copy that server running on url http://127.0.0.1:8000 + /api/v1/ plus add this extra key = http://127.0.0.1:8000/api/v1/

  1. Copy that url and paste this value in frontend .env file in this key "VITE_API_BASE_URL=":

    cd frontend
    cp .env.eample .env
    
  2. Run the Vue 2 development server (in a separate terminal window):

    cd frontend
    npm run dev
    
  3. Access the application in your browser:

Open your browser and navigate to http://localhost:5173/. The Laravel backend will serve the Vue 2 frontend.