coding the next BIG social networking app (ep3)

Phil Choi builds a social app across three repos. He's swapped AsyncStorage for MMKV, set up Zod validation and React Query, and fixed peer dependency issues with vector icons. He's aiming for April 10 to finish core work before handling social logins, webview pages, and push notifications.
Chapters
Previously on Less Social. All the wireframing for the designer is done now. The dad senior developer and his juniors eagerly await for the long awaited design and in the meantime are ready to keep coding the functionalities of the app.
What's up, guys? I've been sleeping all weekend but still coding, you know, and I was reading this quote today. Any fool can write. Any fool can write code that a computer can understand. Good programmers write code that humans can understand. So I'm just trying to make it so that other people can read my code. So yeah, let's keep going. We're doing Let Phil Social Mobile. I got a little bit of the wireframe low fidelity designs done. You know, I know I'm going to have a top tab sliding thing here or there's many tabs. I'm. I know there's going to be something here and then there's going to be a view switcher here and I know I want some animations where maybe right now the scrolling will kind of have animation to hide some stuff on the top. And I know that I'm going to have a chat room and that's about it for now. But we'll keep on moving along. We're just waiting on the design. So there was a little bit of a hiatus. Just time to get back on the horse, get to the finish line. The vector icons, bro, that was the, that was, that was so difficult because it was a. It was a peer dependency from React native elements and it seemed like everything is out of date and one thing was getting updated and one thing wasn't. So I had to kind of run. I had to make a patch and change up the node module code a little bit to make it work. So it's working now. But yeah, that was, that was like a big bottleneck in the beginning. Oh, we're in, we're in March now. So actually this is a good time where we can look at the trello board and start moving things to finished. Right. So let's take a look. I think tonight I'll probably finish the social logins. Okay. So I think home screen is ready for qa. React navigation's done. React admin. I'll talk to Jocelyn. I think she's done with it in an admin panel. I know it's done. Whoa, this is bugging out on me. Hold on. All right, we did the. Load the animation, check if email exists. Endpoints done. API service stuff done. Persist login state stuff is done. Register screen. I think it's pretty much done. Create user endpoint Stuff is done. React took form, validation done. We set up Zod, set up the user model. Forgot Password screen. Done. Set up Async storage. Done. Global state management reacts done. I think some stuff is still being done with i18n. I'll take that over. Oh, this is finished too. We got a lot more stuff done 2025 in January than February. I'm pretty happy about it. We keep it going. But the ones that I want to do tonight are probably the social login stuff. So those will probably be done by next time. Microsoft login, I think that's what Song said is like popular in America. Apple login will wait and then I'll probably set up React native Webview and set out some simple web pages where we can put a bunch of text in. For terms of service and privacy policy, I think I'm going to switch out my Async storage for MMKV. I think it says it's 30 times faster. So I like that. We got to get finished by the beginning of middle of April, like April 10th, so we can start putting everything for deployment. Yeah, let's just keep on moving forward. Gotta start. This week's pretty hectic for me, but no excuses, I'll keep working. Just working here. It's getting pretty late. Fix the main wrapper stuff. I got this kind of working on this screen, but I'm still setting up the typescript for my theme. So just gotta keep working, get it done. See in the next one with the initial main wrapper, I think in the, in the debug mode, I just set everything to center and I had a couple things where I was having padding for like a safe area view. But I realized React Native elements does the padding for me. So I was double. I was double adding padding everywhere. So it was kind of messing up my layouts. But everything is better and some layouts are going to be different than the others. So like main screens will probably have that. Main wrapper. Chat screen will be a little bit different. List screens will be a little bit different. So just, just keep going. Definitely. I think past experiences help a lot because, you know, it's not the first, first rodeo or whatever. It's. I know maybe how something should look or something should work. And I have an idea, but we haven't even gotten that deep yet. So a lot of it is just setting the project up and making sure like, you know, any redundant code, you just do it once, like a wrapper or something and just follow some like, patterns and stuff and you know, a Code base. It should be very consistent. There shouldn't be anything very random. So if you want to learn from me and you want to learn how to build a full scale application, click on the link below and let's get started. So the steps that we can do while we're waiting for the design is just maybe functionality, you know, that's why I'm talking about social login. We can set up like the web view, the image picker. Maybe we can start making some kind of form to post something to the database, retrieve the posts and things like that. Just set up that, you know, low fidelity wireframe designs. Hey, what's up guys? Just having second meeting with Ross right here. Gonna show them what I built so far and the wireframes and see where it goes. So it depends, right? Because there's a lot of like design work and then there's a lot of functionality work. But what we can do is all the functionality work but make sure it doesn't mess around with any of the design work that might come in. So it's like a great balance. But you know, we know that we're going to post something to the Dave Vase. We know that we're going to have comments, we know that we're going to have replies to comments. You know, we know we're going to have replies to replies. So we're gonna have to figure that out. We know that we're gonna have some onboarding screens. There is a bunch of work to do but just put those steps in place to wait for a design. But once the design comes in, implementing the design, it also depends on the design. Right? But I'm kind of hoping if the design system is correct and everything is good, you know, it should be easy to implement. You know, it should take no longer than, you know, three weeks. Just going through the code base real quick. So I don't think I really did this before maybe with the whole code bases. So we have let Social Backend City, Social Admin. So we're using a bunch of code here, React Admin. I think we did kind of, I think I did show the code. Maybe this is gonna be a little bit redundant but for some of you. But you gotta know there are new viewers too. So we're using something called this Molecular data provider which is gonna. Because molecular comes up with like all these like list and get actions that we can use here. And we're using something called React Admin which is very good. We have a user service but each of these that are running are going to have been running in their own Docker container. So we have our create function, we have our exists function, we have our update function, we have a bunch of stuff here. We have our methods where we're running our function for our factory function and we have our me, we have a resolve token that we use in our and we're using Firebase in here. So I made a Firebase mixin. So that Firebase mixin is just taking my Firebase admin key and setting up some Firebase admin functions to be used within my code base. So that is what I'm using here. And then we'll just keep going there and here I'm going to be able to send push notifications and all that kind of stuff through the server. So next where we have the most code probably is the light social mobile. So basically I have my code base here, I have my patches, I have my src folder, I have my lint, my prettier file all set up and everything like that. I have my services which I'm using react query, I have my query provider, I have my query wrappers and then I have my I have my domain services. So like user service. And each of those will have the index, the query keys, repository and types. The repository will just be the requests with the axios and then inside of the index I'll have it export the functions in the repository with the react query. So it makes everything pretty clean. What I've been working a lot on is the theme, definition file and all this kind of stuff. Yeah, I think everything is looking pretty good. Let's get started. We have a bunch of small little components so I can sign in here, sign in, sign in here. And then I'm going to make some little tool tips here where it's going to give you some information about what these are actually doing. I think that's going to be like all around the app, kind of give people instructions. Yeah, the app is looking pretty good. It's at a pretty cool state and hopefully it'll be more done by the next time I see you guys. So right now we're working on three code bases. I do need a landing page, I do need a web client as well. So just going to keep moving forward. So some thoughts I have on upcoming like challenges is just like, you know, we might get rejected from the App Store, Play Store, and you just have to, you know, make sure your permissions are correct. You know, maybe something with like push notifications has changed. I have to set that up. Yeah, we don't even have an Apple developer account or a Play Store account yet. We have to get those set up. We have to set up some kind of fast lane stuff. You know, it's just like programming is always changing. This documentation is always changing. So I have to read it over. And I'm not, you know, I used to know how to do it, but me, I don't know how to do it now. So I have to read and, you know, get all that done, and whatever happens, happens. And yet, think on your feet and get it done. If you want to code like me and the way I've done it, click on the link below and join the mentorship program. And if I can do it, you can do it too. Coding saves lives.
More from Phil

day in the life of a software engineer | 5 hour productivity | building my dev agency 🔥

day in the life of a software engineer | 3 hour productivity | coding my 6-figure community startup

day in the life of a software engineer | 5 hour productivity | coding our sns startup app LFG

day in the life of a software engineer | 5 hour productivity | creating apps that makes big money






