Skip to content

fred8617/aha-ai-exam2

Repository files navigation

Aha AI Exam2

Requirements

Front-End Frameworks

React + Typescript + Next.js

CSS Frameworks

MUI + Tailwind

Coding Styles

https://github.com/airbnb/javascript

Hosting

https://aha-ai-exam2.vercel.app/

Pixel-Perfect Side-by-Side Testing

https://www.figma.com/file/ToWLoNDLlE7hY6Uyatu4Pq/Pixel-Perfect-Side-by-Side-Testing?type=design&node-id=0-1&mode=design&t=8ar3S9hVgkyaPqKU-0

Assessment

Page Layout

  • Nav Bar [10 web/mobile]
  • Home [20 web/mobile]
  • Results [30 web/mobile]
  • Followers/Following [20 web/mobile]
  • Tags [20 web/mobile]

Routing

  • Home page → Tag page → (back)
  • Home page → Search page → (back)
  • Friends
    • Following
    • Followers
  • Search
    • Empty Content
  • Tags

Advanced Effects

  • Skeleton loading screen
    • Results
    • Tags
    • Friends
  • Infinite loading
    • Results in xs screen
    • Results in large screen - using virtualized grid, need click More button
    • Friends

Other (If it is required or have enough time)

  • Unit test with Jest
  • E2E test with Cypress