Portfolio - Nour Rajeh

Website targeted for students to learn on the go using flashcards. The ecosystem uses an object-oriented approach of creating labeled flashcard decks called Leafsets, each containing key-value pairs called Leafcards. The website supports making ones Leafsets public and thus visible to other users to save them and practice while also being able to search public Leafsets.

Back to Top
Earned Skills
Sneak Peak
Presentation
Github Repo

Other Contributors: Taline Zeidan, Raghed Abu Saad, Carl El Khoury

Skills Acquired

Flexbox and Grids for responsiveness
Website Design and Prototyping on Figma
Media Queries for display on different screen
Forms for authentication and for leafsets creation
Dynamic insertion / deletion of HTML components using JavaScript
Theme Development including a color palette, logo and icons design

Peak at the Project

Leafcards welcomes the user with a landing page that provides themed illustrations with eye-catching titles that fully desrcibes the website's features and aims. Upon authentication, users have access to all the Leafsets they created in the My Leafsets page. There they would find a button to create a new leafset and be able to also edit existing ones in a lab-like view. They could also potentially find interesting leafsets created by other users and made public on the Discover Page that includes a search bar to search by label, user or name, a grid of trending leafsets and another of similar ones to the user's. Finally, a Settings dashboard is accessible from the navbar where basic actions where implemented such as password and email change as well as logging out.

leafcards my leafsets page — My Leafsets Page :

leafcards leafset create page — Create Leafset Page :

leafcards discover page — Discover Page :

leafcards settings page — Settings Page :

Canva Presentation

Github Repo

Check out the source code for this project in this repo: github.com/itsnourr/Leafcards