aktivate-assessment Tailwind Templates

Aktivate Assessment

This repository contains the completed assessment task for a Front-End Developer role, focusing on Vue.js and Tailwind CSS (version 3).

Aktivate

šŸ“‹ Overview

Aktivate is a comprehensive web application for managing influencer marketing campaigns. It enables businesses to find influencers, create campaigns, and track collaboration performance in a sleek, user-friendly interface.

šŸ“ Table of Contents

✨ Features

  • User Authentication: Complete login flow with email validation and password reset
  • Dashboard Analytics: Visual data representation for campaign performance
  • Campaign Management: Create, track, and manage marketing campaigns
  • Influencer Discovery: Find and filter influencers based on requirements
  • Collaboration Hub: Central space for team collaboration and communication
  • Responsive Design: Fully responsive UI that works on mobile, tablet and desktop
  • Modern UI: Sleek design with consistent branding and smooth transitions

šŸŽ¬ Demo

Image

šŸ› ļø Technologies Used

  • Frontend Framework: Vue.js 3 (Composition API)
  • Styling: Tailwind CSS 3
  • Routing: Vue Router 4
  • Icons: Font Awesome
  • Charts: Chart.js with Vue-Chartjs
  • UI Components: Custom components with Tailwind
  • Development: Vite
  • Package Management: npm

āš™ļø Installation

Prerequisites

  • Node.js (v18.0.0 or higher)
  • npm (v8.0.0 or higher)

Setup Instructions

  1. Clone the repository

    git clone https://github.com/yourusername/aktivate.git
    cd aktivate
    
  2. Install dependencies

    npm install
    
  3. Start the development server

    npm run dev
    
  4. Build for production

    npm run build
    
  5. Preview production build

    npm run preview
    

šŸ“ Project Structure

aktivate/
ā”œā”€ā”€ public/
│   ā”œā”€ā”€ bg.png
│   ā”œā”€ā”€ logo.png
│   ā”œā”€ā”€ Logo2.png
│   └── profile.png
ā”œā”€ā”€ src/
│   ā”œā”€ā”€ assets/
│   ā”œā”€ā”€ components/
│   ā”œā”€ā”€ layouts/
│   ā”œā”€ā”€ router/
│   ā”œā”€ā”€ utils/
│   │   └── navItems.js
│   ā”œā”€ā”€ views/
│   │   ā”œā”€ā”€ SplashView.vue
│   │   ā”œā”€ā”€ SignInView.vue
│   │   ā”œā”€ā”€ ForgetPasswordView.vue
│   │   ā”œā”€ā”€ PasswordResetView.vue
│   │   └── DashboardLayout.vue
│   ā”œā”€ā”€ App.vue
│   └── main.js
ā”œā”€ā”€ index.html
ā”œā”€ā”€ package.json
ā”œā”€ā”€ postcss.config.js
ā”œā”€ā”€ tailwind.config.js
└── vite.config.js

šŸ‘„ Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

  1. Fork the repository
  2. Create your feature branch (git checkout -b feature/amazing-feature)
  3. Commit your changes (git commit -m 'Add some amazing feature')
  4. Push to the branch (git push origin feature/amazing-feature)
  5. Open a Pull Request

šŸ“„ License

This project is licensed under the MIT License - see the LICENSE file for details.


Made with ā¤ļø by [Your Name]

Top categories

Loading Svelte Themes