Create a Social Media Platform using SvelteKit and PocketBase - Setup

all right so in the previous video I showed you a preview of the platform we're going to create together in this course hold on just one second I am offering free coaching to those of you who need help in job script development flter development and most front end or full stack job script Frameworks if you're not opposed to receiving some help message me through Discord at 8 dang I'll be sure to include my tag below but remember I might not be able to help with everything but I'll try my best but with other way let's get back into the video so the first thing we're going to do is open up the terminal and run mpm in in spel and this will create a scaffold for spel project click enter click yes and make sure to click the skeleton project and choose typescript syntax then no additional options then we're going to install the dependencies we're going to say mpm install pocket base we're going to use pocket base to interact with the pocket base database so then we're going to do highlight.js to do the syntax highlighting that I showed you in the previous video and we're going to get one final package called iconify icon to simplify the icons for our application because we're doing a typescript project highlight.js doesn't support typescript out of the box so we're going to have to install the typescript version of it so we're going to do mpmi D- saave Dev at types highlight.js and this will install the typescript version of highlight.js well not the typescript version but the types for highlight.js so once you're done here close the terminal and go over to the GitHub which I'll link in the description and you'll see in the read me there's a few links one here to the pocket base docs but I found that pocket base had some problem with displaying the rules and everything else was a little bit buggy so I had to install previous version right here so let's go the current version is version 0.2.1 so I decided to install 21.0 which just fixed the problem so right here just go over to this link right here the release GitHub and install the one for you mine is this one right here so once it's done installing you see this you see this folder let's drag it into the source folder copy folder and then let's rename this to pocket base now we're going to open the Pocket base folder so pocket base and then we're going to do/ pocket base serve then let's click the link to the admin UI and then let's create an account so right here you should see the admin p panel with just one collection which the users and no documents so if you if you click on this gear and you go to API rules you should see the API rules but the problem with the previous version that I tried to do this on was that the API rules wouldn't load so I wouldn't be able to edit them and it just left the project insecure so I didn't want to do that I wanted to get an actual secure version so once you're in the pocket base admin open up the collection settings and right here we rename this photo from Avatar to photo and then we create a new field with plain text called bio they don't and they're not forced to have a bio and we're also going to have a relation which is going to be called followers right here and this is going to be from the users collection and there going to be multiple right there and now in the API rules right here we could delete the list and search The View rule right there and the create and all of these rules R the create update and delete rules and the manage rule are going to be for admins so then we save changes right there confirm and you should see that it's updated so now let's create a new collection called posts and right here we're going to create a new field which is going to be a pling text called title and it's going to be non-empty and we're also going to create another New Field which going to be playing text called content and it's also going to be non-empty also we're going to create a Json which is going to be tags nonempty and then we're going to get a relation which is going to be a relation to the user that created it this is going to be a relations to users and it's only going to be single and this is non-empty so here let's create a plain text which is going to be language so the language of the code snippet that we actually want this is going to be nonempty and also we're going to create a relations which is going to be multiple to users which going to be likes so in the API rules we say the list in Search and the view are going to be for everybody to access but the create update and delete rule are going to be limited so at the end of it you should have two collections one post one user and it should look like this thank you guys for watching I hope you're looking forward to the series like subscribe and comment

Channel: Daniel Gorra

Views: 315

Keywords: Programming, Coding, Coding Tutorial, Coding Course

Id: lmBGGgX4ULs

Length: 4min 57sec (297 seconds)

Published: Sat Mar 02 2024