Scribd
Upload
6 views2 pages

React Intern Assignment (Inscripts)

The assignment requires creating a static React prototype that matches a provided Figma design of a spreadsheet view. It emphasizes building a pixel-perfect layout using React 18, TypeScript, and Tailwind CSS, with specific acceptance criteria for functionality and code quality. Optional stretch goals include adding keyboard navigation and column resizing features.

Uploaded by

rojaksh963
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
6 views2 pages

React Intern Assignment (Inscripts)

The assignment requires creating a static React prototype that matches a provided Figma design of a spreadsheet view. It emphasizes building a pixel-perfect layout using React 18, TypeScript, and Tailwind CSS, with specific acceptance criteria for functionality and code quality. Optional stretch goals include adding keyboard navigation and column resizing features.

Uploaded by

rojaksh963
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

React Intern Assignment

Join us in building the next generation of AI-powered solutions— designed to scale impact,
spark innovation, and move the world forward.

1. Goal

Create a static, front-end-only React prototype that visually matches the attached screenshot
of the product’s spreadsheet view.

2. Core Criteria (IMPORTANT)

Build a pixel perfect experience as per Figma (including the actual spreadsheet experience) in
React-

Figma URL:
https://www.figma.com/design/3nywpu5sz45RrCmwe68QZP/Intern-Design-Assigment?node-id=
2-2535&t=DJGGMt8I4fiZjoIB-1

3. Tech Stack

●​ React 18 (Vite or CRA—your choice)​

●​ TypeScript (strict mode)​

●​ Tailwind CSS for utility styling (already used across Gob)​

●​ react-table (or ⚡your own minimal table component) for the grid​
●​ No state management library needed—local component state is fine.​

5. Acceptance Criteria

1.​ Pixel-close layout to the Figma.​

2.​ Google Sheet/Excel like spread sheet experience​

3.​ All buttons/tabs change state or log to console—no dead UI.​


4.​ Code passes npm run lint (ESLint + Prettier) and npm run type-check.​

5.​ Clean commit history with meaningful messages.​

6. Stretch (optional, only if time permits)

●​ Keyboard navigation within the grid (arrow keys).​

●​ Column resize / hide toggles.​

7. Submission

●​ Live URL to access the built out product


●​ Github
●​ Include a short README.md explaining setup & any trade-offs.​

Good luck and have fun 🐙

You might also like