0% found this document useful (0 votes)
26 views1 page

Fullstack Assignment - Chitkara

The document outlines the requirements for developing a mini web application with a responsive frontend using React and Three.js for displaying 3D models, a Node.js/Express backend with specific API endpoints, and Firebase for database integration. The application should allow users to interact with 3D models and filter them through a search bar. Additionally, documentation on deployment steps is required, along with resources for 3D models and environment maps.

Uploaded by

random221099
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
0% found this document useful (0 votes)
26 views1 page

Fullstack Assignment - Chitkara

The document outlines the requirements for developing a mini web application with a responsive frontend using React and Three.js for displaying 3D models, a Node.js/Express backend with specific API endpoints, and Firebase for database integration. The application should allow users to interact with 3D models and filter them through a search bar. Additionally, documentation on deployment steps is required, along with resources for 3D models and environment maps.

Uploaded by

random221099
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

Technical Round

Goal:

Develop a mini web application that includes frontend, backend, and database integration.

Requirements:

1.​ Frontend:
○​ Create a responsive webpage using React (preferred) that displays a 3D model
using Three.js or React Three Fiber.
○​ Include basic interaction: the ability to rotate, zoom, and pan the 3D model.
○​ Provide a search bar where users can filter models by name (data fetched from
the backend).
2.​ Backend:
○​ Develop a Node.js/Express server with the following endpoints:
■​ GET /models: Fetch a list of stored 3D models (return mock data with
fields like id, name, and url).
■​ POST /upload: Accept links for 3D models (e.g., GLB/GLTF files)
along with the name, description and store them in the firebase
database.
3.​ Database:
○​ Use Firebase to store model metadata (e.g., id, name, description, uploadDate,
url).
○​ Ensure the /models endpoint fetches data from this database.
4.​ Documentation:
○​ Share the steps to deploy the application over the internet.

You may refer to the Three.js Documentation for guidance on using the library’s features.
While web searches for syntax clarification and Three.js documentation reference are
permitted.

Resources: 1. Folder containing the 3D model and an environment map. You can also use
assets from any other sources.

https://www.dropbox.com/scl/fo/3wvw6oja2pt90gph2srmc/AOTJBLii8yUSgaz2HhBwHoc?r
lkey=249kwxq33on7mx1d4exfcqqo4&dl=0

You might also like