we will build a real time chat app with react native from scratch and this is going to be a lot of fun and if you find this interesting please smash the like button for me 💯 ,also consider subscribing!!
we will learn and explore about different design and styling and upgrade our skill set!!
keep hustling ❤️keep sharing knowledge ❤️
In this hands-on tutorial, we will cover everything from setting up the development environment to building the user interface and implementing real-time functionality. React Native will be our framework of choice, allowing us to create a cross-platform mobile app that works seamlessly on both iOS and Android devices.
MongoDB, a popular NoSQL database, will serve as our backend to store and manage the chat data. You will learn how to set up a MongoDB database, configure the necessary APIs, and establish a connection between the app and the database.
source code - https://github.com/SSA-988/messenger
More Projects And Tutorials!
***** steps to make this work on your own phone! || also check out the comments for answers!
updating the API URL in your client-side code is necessary to ensure that your app makes API requests to the correct server. However, you may also need to update the server-side configuration to match the IP address or domain name changes
mongoose
.connect("mongodb://yourIpAddress/yourprojectnameinmongodb", {
useNewUrlParser: true,
useUnifiedTopology: true,
})
.then(() = {
console.log("Connected to Mongo Db");
})
.catch((err) = {
console.log("Error connecting to MongoDb", err);
});
if doesn't work, in place of ipaddress add 127.0.0.1:27017 it should probably work!
then ...
app.listen(port, "IpAdressofyourpc", () = {
console.log("Server is running on http://youripadress");
});
then in the frontend-part while initialising the function you need to make the change
axios
.post("http://youripadress:8000/register", user)
**** To get the ip adress of your sytem
Mac = ipconfig getifaddr en0
Windows = ipconfig
🔴 Let's build Airbnb with React Native : • 🔴 Let's build Airbnb with React Nativ...
🔴 Let's build Zomato With React Native : • 🔴 Let's build Zomato with React Nativ...
🔴 Let's build React Js Shopping Cart (Easy) : • 🔴 Let's build React Js Shopping Cart ...
🔴 Let's build a Pizza Application (Dominos) with React Native : • 🔴 Let's build a Pizza Application (Do...
🔴 Let's build a Fitness Application with React Native : • 🔴 Let's build a Fitness Application ...
🔴 Let's build PVR (Movie Booking App) with React Native : • 🔴 Let's build PVR (Movie Booking App...
🔴 Let's build Netflix with React Native : • 🔴 Let's build Netflix with React Nati...
🔴 Let's build Redux Shopping Cart for beginners : • 🔴 Let's build Redux Shopping Cart | T...
🔴 Let's build a complete React Js Shopping Cart with Redux : • 🔴 Let's build a complete React Js Sho...
🔴 Let's build a full Stack laundry app with React Native : • 🔴 Let's build a full Stack laundry ap...
🔴 Let's build Spotify with React Native! (Spotify API, Expo App Auth) : • 🔴 Let's build Spotify with React Nati...
tags:
react native chat applicaton
react native mern stack app
mern stack chat app
react native frontend
react native fullstack project
react native roadmap
react native laundry app
react native firebase integration
frontend projects react native
react native e-commerce app
react native cart system
frontend development react native
frontend development projects
react native beginner projects
react native interview questions
react native firebase
react native redux
booking app react native
booking app reactJs
react native backend
frontend interview series
frontend reactJs projects
firebase authentication react native
firebase authentication reactJs
react native full course
react native beginner course
redux cart system in react
redux toolkit
react native sanity
movie booking app
Pvr clone react native
movie booking system
react native expo projects
laundry app react native
frontend development roadmap
frontend interview questions
razorpay PaymentGateway
PushNotifications
LocationBasedServices
movie booking app expo
react native frontend
react native fullstack project
react native roadmap
react native laundry app
react native firebase integration
frontend projects react native
react native full stack chat application
mern stack app using react native
real time chat app using mern stack
mongo db
mongo db full stack projects
mongo db chat application with react native