ucla design.

screenshots, flows, and implementation details

Interactive web app for designing and reviewing dorm layouts with drag & drop furniture, searchable database, and a NoSQL-backed data model. Built with React and a Node/Express API over MongoDB.

purpose / features.

Transitioning into a new dorm room presents challenges, particularly for freshmen or individuals unfamiliar with their new environment. Properly planning a room layout and understanding the necessary items can significantly ease this transition. UCLA Design is a web application that helps users visualize and plan their next room. With built-in scaling, users won't have to scale objects to their new room manually and can set dimensions for any new objects a user wants to import. Designs are dynamically stored within a database and can be queried for easy access to saved rooms. The platform also promotes user interaction and collaboration with built-in templating where all public rooms are displayed on a templates page, ready to be saved and personalized to anybody's preference. With additional features such as a "todo-list" and "first day of college checklist," users can also store personal items they need to be reminded about along with default essential items and tasks that need to be done. As for financial worries, prices for the default 14P meal plan are displayed, allowing users to manage or adjust their budget accordingly. UCLA Design is also authenticated, prompting users to log in or register before they start their journey on the platform. To thwart against unwanted attackers, all information stored in the session within the database, where personal information is tied to the user along with password encryption, is inaccessible even with an admin API key. Lastly, to protect against password guessing, there are password requirements a user must fulfill before registering, along with a timeout set after multiple invalid attempts to login.

technology.

MongoDB/Mongoose, Express, React, and Node.