/fe-technical-assessment

Primary LanguageTypeScript

Frontend Technical Assessment 🚀

Overview

We want to see your skills with React and TypeScript. You'll be given a Figma design to replicate in a Vite project using Tailwind CSS. Plus, you'll use an AirOps app to fetch and display data.

What You'll Do

  1. Fork the Repo: You'll get a barebones Vite + React + TypeScript + Tailwind project. Fork it and get started.
  2. Design Implementation: Copy the Figma design into your project. Make it look as close as possible.
  3. Data Integration: Create an AirOps App that returns the necessary mock data for the design and execute it to display the mock data! 📊

Example of Airops App for the Data Integration

Note: if you need to do any create, edit or delete, it doesn’t need to persist anywhere outside of the React state.

Time Frame

Try to finish within 3 hours. ⏰

What We Care About

  • Code Quality: Clean, readable, and well-structured code. 💻
  • Design Accuracy: Your app should look like the Figma design. 🎨
  • Functionality: Your app should fetch and display data correctly. 🔄

How to Submit

  1. Fork our repo.
  2. Make your changes.
  3. Push to your forked repo.
  4. Share the link to your repo with us. 📤

Tools

  • React ⚛️
  • TypeScript 📝
  • Tailwind CSS 🎨
  • Vite ⚡

Getting Started

  1. Fork the Repo: 
    git clone [your-forked-repo-link]
cd [repository-directory]
  2. Install Dependencies: 
    Copy code
npm install
  3. Start the Dev Server: 
    Copy code
npm run dev
  4. Design Link: Figma Design
  5. Relevant AirOps Links:

That's it! If you have any questions, just ask. Good luck! 🍀