Little Lemon Restaurant App
Final Project for Meta React Native Specialization on Coursera
This TypeScript-based application is the final project submission for the Meta React Native Specialization on Coursera. Built with React Native and Expo.
- User Authentication
- Secure signup with form validation
- Login/logout functionality
- Profile management
- Account deletion option
- Menu Browsing
- Category filtering (Starters, Mains, Desserts)
- Search functionality
- Menu item details view
- User Experience
- Real-time profile synchronization (Avatar updates reflect instantly across all screens)
- Personalized profile with avatar
- Notification preferences
- Smooth navigation between screens
- Technical Features
- Type-Safe Codebase (TypeScript)
- Offline data persistence (SQLite)
- Persistent key-value storage (Async Storage)
- Form management with Formik & Yup
- Context API for state management
- Animated UI feedback
- Responsive design
Designed with Figma (Wireframes)
/WireFrames directory| Screen | Preview | Description |
|---|---|---|
| Welcome |  |
Landing with auth options |
| Onboarding |  |
Account creation flow |
| Login |  |
Credential entry |
| Home |  |
Menu browsing with search/filters |
| MenuItemsDetails |  |
Dish information display |
| Profile |  |
User settings management |
Wireframes focus on user flow and functionality rather than visual design details
(https://www.canva.com/design/DAGrP02K6yU/wjHQQR1MMax_pNdEZBGPGw/watch?utm_content=DAGrP02K6yU&utm_campaign=designshare&utm_medium=link2&utm_source=uniquelinks&utlId=hf05d260251
"Click to play")
Watch the 2:30 minutes flow demonstration
- Node.js v16+
- Expo CLI (
npm install -g expo-cli) - Android/iOS simulator or physical device
- Clone repository:
git clone https://github.com/pro804/LittleLemonGo.git cd LittleLemonGo - Install dependencies
npm install
- Start development server
expo start
- Run on device/simulator
# Press a for Android # Press i for iOS # Scan QR code with Expo Go app (physical device)
| Library | Version | Documentation |
|---|---|---|
| React Navigation | v7.x | App navigation and routing |
| Formik | 2.4.6 | Form state management |
| Yup | 1.6.1 | Form validation schemas |
| Expo SQLite | 15.2.12 | Local database storage |
| React Native Reanimated | 3.17.4 | Advanced animations |
| Async Storage | 2.1.2 | Persistent key-value storage |
The project leverages TypeScript for:
- Type-safe component props with strict interfaces
- Reduced runtime errors through compile-time checks
- Enhanced code maintainability with explicit type definitions
- Improved developer experience through IntelliSense support
Pull requests welcome! For major changes, please open an issue first.
This project is licensed under the MIT License.