Full-Stack Mobile App with React Native, Redux, Django & AWS

Style the tab navigator with expo vector icons for home, favorite and cart icons based on route.name, applying ash 4 by 5 6 3 background radii 30 and white tint.

Learn to implement a search bar and category selector on the home screen of a React Native app, with safe area view, category state, and a mock product list.

Build and refine a React Native product display using a FlatList, with category filtering and search, plus a two-column layout and refresh control for updates.

Fix unique list keys by using the index, hide the top bar on keyboard, and style the no product message with centered layout, aligning with the upcoming product detail screen.

Learn to implement a product detail screen in a React Native app, enabling navigation from the home screen with params for id, image, name, description, and price.

Learn to add items to favorites in a React Native app using AsyncStorage to persist item id, image, name, and price on heart press, with toast feedback.

Load favorite items from async storage on screen focus, display them in a list with image, name, and price, delete items with a trash button, and navigate back.

Install and configure Redux Toolkit for a React Native app, create a basket slice and Redux store, and wrap the App with the Provider to enable state management.

Create a Redux basket slice with items and total price, and implement add to basket with payload, duplicate checks, and quantity and price updates for a robust cart.

Update item quantities and the total price in a React Native cart by dispatching update actions from a basket slice, handling plus and minus clicks to reflect price changes.

Switch to use focus effect in the product details screen to update cart state on focus and disable the minus button when quantity equals one to prevent going below one.

Demonstrate a checkout modal in a React Native app using react-native-modal, capture customer name, phone number, and address, validate cart, and animate with backdrop opacity and zoom.

Remove an item from the Redux basket by ID, price, and quantity, update the total, and dispatch the remove action; fix cart state for items already added.

Reset the basket by clearing items to an empty array and the total price to zero, then dispatch the clear basket action after a successful order placement.

Store placed orders in async storage with a date-based order id, then load and group them by date on the order screen, refreshing on focus.

Display placed orders on the order screen using a safe area view and a flat list in React Native, rendering orders and their items with images, names, quantities, and prices.

Fix home screen by adding a dollar sign to prices, handle offline with a network error view, and render a prehistoric man asset with wifi icon for the offline state.

Install python and add it to your path, create and activate a virtual environment, then install Django and Django Rest Framework, migrate, and run the server to access admin.

Configure Django static and media files, set media URL and route, update urls.py, install pillow, run migrations, and test image uploads to the product folder.

Set up a Django REST API by building serializers, views, and routes for categories and products, register them with a router, and enable listing endpoints.

Set up an AWS S3 bucket to host media for a Django backend, install Django storages and Boto3, and configure default file storage to serve images from S3.

Learn how to hide sensitive information by using django environ and a .env file, load environment variables in settings, and manage keys like secret key and AWS credentials.

Deploy a django app on render using gunicorn as the wsgi server, manage dependencies with a virtual environment and requirements.txt, and enable white noise for css styling.

Re-add environment variables on render after deleting them from GitHub due to a missing gitignore, then copy and paste each key and value to re-enable the deploy.

Learn to deploy a Postgres database on Render, configure Django to connect via dj-database-url, migrate data, and restore data through PgAdmin to a remote Render database.

Switch the fetch to the render API, update app.json splash and adaptive icon, and build the Android apk via Expo EAS for testing.

Fixes a type mismatch by converting price from string to number using parsefloat. Updates the cart and order flows and validates apk build and deployment.