Preview:
Description:
Kastelli is a fashion mobile app template built on top of React Native. It is available and supports both Android and IOS platforms. If you don’t wish to start development for your online fashion service from scratch ? Kastelli is your answer. App has all the necessary pages. Use this app to bootstrap your online fashion service fast. This project is a TEMPLATE. Not backend project.
Features:
– Built with React Native CLI 0.71.8.
– Only Functional Components & React Hooks.
– All icons in SVG format.
– For Android & IOS
– Well structured components
– You can add to cart product and delete from cart
– Choice of product size and color – displayed in the order
– You can make product favorite
– Design file in figma format included
– Ready for the Backend
– Validations included
– All files except icons in .tsx format
– Used Preloader for images
– Used Redux and Redux Persist. If you close the application, your added products to the cart or wishlist will not be deleted.
Download APK:
You can download – APK
Design:
This project is a pixel perfect development – Kastelli
Validation:
Validation included, you can easily enable or disable validation for testing app.
Technology:
Screens switching:
You can easily switch the screen version (Home, Product, Order History) by changing the variable inside the file, write 1 or 2 which means the screen version.
API:
Used – RTK Query for getting data. API created on a third-party resource.
RTK Query is a powerful data fetching and caching tool. It is designed to simplify common cases for loading data in a web application, eliminating the need to hand-write data fetching & caching logic yourself.
Endpoints: products.json, banners.json, carousel.json
Dependencies:
"@react-native-async-storage/async-storage": "^1.18.2", "react-native-keyboard-aware-scroll-view": "^0.9.5", "@ptomasroos/react-native-multi-slider": "^2.2.2", "react-native-responsive-dimensions": "^3.1.1", "@react-native-community/clipboard": "^1.5.1", "@react-navigation/native-stack": "^6.9.12", "react-native-safe-area-context": "^4.5.3", "@react-native-picker/picker": "^2.4.10", "react-native-image-progress": "^1.2.0", "react-native-flash-message": "^0.4.1", "react-native-linear-gradient": "^2.6.2", "react-native-parsed-text": "^0.0.22", "react-native-phone-input": "^1.3.6", "@react-navigation/native": "^6.1.6", "react-native-dashed-line": "^1.1.0", "react-native-fast-image": "^8.6.3", "react-native-collapsible": "^1.6.1", "react-native-screens": "^2.18.1", "react-native-modal": "^13.0.1", "react-native-dotenv": "^3.4.8", "react-native-eject": "^0.2.0", "react-native-svg": "^9.13.6", "@reduxjs/toolkit": "^1.9.5", "redux-persist": "^6.0.0", "react-redux": "^8.0.5", "react-native": "0.71.8", "react": "18.2.0",
Important commands to run the application:
Screeens Included:
01_Onboarding 1 Screen
02_Onboarding 2 Screen
03_Onboarding 3 Screen
04_Sign in
05_Forgot password
06_Forgot password (sent email)
07_New password
08_Sign up
09_Sign up (account created)
10_Verify your phone number
11_Confirmation code
12_Home V1
13_Home V2
14_Categories
15_Burger menu
16_Shop
17_Sorting popup
18_Product V1 long
19_Product V2 short
20_Description
21_Reviews
22_Wishlist
23_Filter
24_Profile
25_Edit profile
26_Payment method
27_Add a new address
28_My Address
29_Add a new address
30_Order history
31_Order history (options)
32_Leave a Review
33_Notifications
34_Track your order
35_Sign out popup
36_My promocodes
37_My promocodes (empty)
38_Cart (empty)
39_Order
40_Checkout
41_Checkout (Shipping details)
42_Checkout (Payment method)
43_Order successful!
44_Order failed!
Fonts:
Images & Icons:
