MemoryLane

MemoryLane is an app designed to help parents craft personalized memories of their child's early years. Users can document and celebrate key milestones, memorable moments, and developmental achievements in a convenient and user-friendly interface.

Tech Stack

• react

• react-router

• axios

• react-icons

• react-slider

• MUI

• react-google-autocomplete

Features

• User Authentication: Users can sign up, log in, and log out securely to access their personalized memories.
• User Profiles: Each user can create, edit, and delete profiles for their children, containing personal information and a collection of memories.
• Create Memories: Users can document key milestones, memorable moments, and developmental achievements for their children.
• Upload Media: Users can upload photos & audioes and videos to accompany their memories, enhancing their storytelling experience.
• Location Tagging: Memories can be tagged with location information, allowing users to remember where special moments occurred.
• Search and Filter: Users can search and filter memories based on title.
• Notifications (Future Enhancement): Planned feature to implement notification functionality for milestone reminders, helping users stay organized and never miss a special moment.

Installation

Developer Environment

git clone <[https://github.com/ghufran-adel/memory-lane-capstone]>
cd <project-directory>
npm install
npm start

• Example User:
  • Username: [email protected]
  • Password: 1234
  • Note: This example user account is limited to viewing functionalities. If you would like to use all functions you need to sign up new account .

Screenshots

screen-capture.14.webm

Lessons Learned & Next Steps

During the development process, I encountered various challenges and learned valuable lessons. One of the challenges was implementing loaction autocomplete, navigate through nested routes and notification system Although I faced difficulties in these areas, it provided valuable learning experiences.

Lessons Learned

• Importance of tackling challenges and exploring new technologies for enhancing user experience.
• Value of persistence and problem-solving skills in overcoming obstacles during development.

Next Steps

Moving forward, the next steps for the frontend development include:

• Continuation of efforts to implement notification functionality.
• Deployment of the site to make it accessible to users.
• Continuous improvement and refinement of the user interface and overall user experience based on feedback and testing.

Backend Repository

Link to Backend Repository