Tim Tries Medusajs the open source Shopify alternative

what is up welcome back to another Tim tries in these videos I try out new tools that I haven't used before and I kind of use my experience in the field to just try them out see how they feel give you my experiences as I go along including feedback whatever positive or negative I'm just gonna try and so in this video we will be trying medusa.js which is basically an open source version of Shopify and that's what their co-founder when we were on the phone the other day told me like it's kind of like Shopify but if you want to do your own thing and so I looked at it and it's actually Shopify it looks amazing it works extremely well I think based on what I've seen on their website and it doesn't have a front end so that's where it's a bit different so it only has apis and stuff and it's quite composable they want to play in that field where you can just plug things in and it works so let's go into the browser let's have a look at their website see what they're offering and just let's just build an example store together see how how that works all right so the open source Shopify alternative yes that's it's some decent marketing and it looks really good and they have like almost 14k stars on GitHub very nice and you can definitely see this is from Developers for developers it's very much like um node.js JavaScript CLI stuff but you know nice Founders executive backing um lovely numbers it all looks good this is cool um so let's just go to the top and how about we just click started let's see what this gives us let's see what the onboarding flow is like because that's generally what makes me not like things if it just doesn't work on the other hand also this is something that works um you have to host it yourself it's not a SAS product it's not in the cloud you have to put it in the cloud yourself and so there's some ideas about that that I have that I won't share now but let's do that in the end let's see how smooth this goes first okay okay so when a getting started page actually goes to a GitHub repository that's when you know it for developers right rather than just going die hard like this let's go in a quick start guide to see if they actually guide us through properly um okay so basically the same but in a nicer format let's zoom in a little bit all right um let's just install the Medusa CLI so here is my terminal um let's rock and roll so we'll just go from scratch okay while this installs let's have a look at what what all this has to offer so we have the Medusa CLI and you can make a new store and I imagine that this dash dash seat variable actually sees the database with like some default products so you can actually have something to look at um I like that because when it's clean and you don't understand the content models you don't have the data how do you get started right you want to see some stuff um okay so oh there it is that worked um well I mean the Tim price folder let's make a new Medusa store beam okay so um I'll let this download um because my internet is not super fast so let's see how long this takes but let's go back to the browser and have a look at what else we get to do um so this is literally the Medusa server as far as I understand it it doesn't include the admin panel right so in that sense it's um it's a little bit like okay we have just a base API layer that works if you want to then change things you need a separate admin and there's also a separate front-end so it comes in these separate packages and I assume this because I'm seeing you have to curl call this API to actually see if something comes out um I don't have python like this installed so I'm gonna do it just like that but first we're going to have to start the develop server okay we're in nice um develop let's go all right so um it says my reddish URL was not found no I I didn't set up anything but it said it's using a fake redis which is good for me this is local development we're just trying it out so I'm assuming they're mocking all that stuff with the data and the database and such so it's running on Port 900 um how about let's try that curl call then let's see what comes out whoa something came out and it was fast so I'm assuming this is a ton of products and let's see what it does here oh not with the curl inside obviously okay so this is Jason these are a ton of products a lot of data nice okay that works then there's some other stuff like some extra plugins I guess to to deal with product images and um for now I don't think we need this um so it seems like our server is just running so next steps could be add your front end or add your admin you know what I'm gonna go for the admin because I kind of want to look at how this interface works let's have a look here so what do we need to do install the admin we literally just have to clone okay we can do that um let's put one back and clone it into Medusa admin yep here she goes um this one we keep this one running this is the server okay so one this one is in I think I just have to just do okay we're just gonna go init npm install it and npm run it cool npm install it's interesting when I use warp this terminal actually the npm install sometimes goes slightly outside of The View um but let's let that run um it's all good and then once it's in we can just run start and it should work and it has like um okay so there's a little login here ah look this is interesting like the seat thing here it comes back right which means most likely they added this the base user oh yeah there it is so there's an admin and a super secret password that we can use so for right now for like testing it out this is all fine so we're just going to use this because the seat run was done in the install that's why we had all the products I think okay so this is still running you see it's not that far just yet but this is the cool thing about such a composable architecture we cannot just build the front end that talks to that Medusa back end that is already running while the admin is still building so let's do that right personally I would have loved to see a next three front end but that's quite new so I assume it might come later so let's go let's just take the next JS one um there you go nice little thing of how it looks it looks great um what do we need we need the Medusa server yeah exactly so we can just use create next app okay let's do that so while this is installing let's go and not be in here but one back and just here okay we're gonna go for my Medusa storefront let's do it so now we're going to install two things at the same time let's hope npm is not too upset with me while I do that okay so it's downloading the files from the repo and that's going to install how about this guy okay this is 50 there this one I was doing pretty fast nice I can imagine it's a pretty light front end right if it's just a demo okay so it's building some stuff here yarn install has failed oh boy let's have a look yeah I think when it's in the context of yarn my M1 Mac with its local python install is not working that's what I think is going wrong here I've had that before okay so what I think I should do go in in the storefront remove the node modules that it's already created with yarn and also what we should probably do is remove the yarn lock file and just do the npm let's see what this does oh no it's going right under the line again anyways this is going okay so now it seems like the the admin is ready while we are installing the front end we go back to the admin and see what do we need to do to get that started nbm Run start that's it okay we can do that that's not too hard okay so something's already running on Port 7000 something else instead sure go to another Port all good okay so it's writing bundle stuff what is this oh wow their admin is actually a Gatsby and package or it's a Gatsby product that's cool why not okay so this is building its bundle has this been installed oh it seems like it well we're doing everything at the same time but why not this is composable architecture for you so we're gonna have to change the end file from the template to an actual logo file so we can just copy paste these things I imagine um and then we just run Dev so before we do that let's just have a look at what we're dealing with here okay so there are Cypress tests in it awesome the m.local that worked so it just has a bunch of URLs of where it can you know grab stuff okay all good and this is just a relatively simple next project I imagine well it has lots of things nice typescript good stuff like it all right so let's run it so this is going to 8 000. and while I look at that it seems like the admin is also running wow we have everything at the same time today here we go so something is a 404 but it's an Ajax goal so if you just close it Let me refresh okay there's something with an Ajax call that it doesn't really like but outside of that here's a store but I'm not oh there's it's lazy loading the images it's just relatively slow it seems explore products this is quite empty but I'm wondering maybe that four or four that we just saw is giving us some issues here um let's see what's happening with that admin oh where were we here so I just have to run start in the admin oh we already did so it's it's on 7001 ah so it showed you the interface and then it went to um the login um and it had the credentials where did it have these credentials yes let's go nice okay we're in so we have no orders and that's the first thing it shows which makes sense because orders are important I guess and products and so this is what we got I guess with that seed property so everything is here we have 400 in stock of the Medusa sweatshirt this is so simple and so clean and then you can even see the raw data off the thing so you can you know what comes out of it the size is a variance it looks like it's all there discounts gift card pricing settings regions and I can imagine you can probably act like you are shipping stuff and your pricing and your you know personal information taxes settings it seems that this is awesome and it was you know it kind of looked really um chaotic because it's such an open system with multiple things that work together it's really composable so I was able to do this chaotically just build them all at the same time and it just works right um I still think I want to see products here so I don't really know what that 404 is we might want to just restart it or something and if that doesn't work then it doesn't work and it is what it is um let's see what other things now that we have this all in place so you can add an external search it seems there are some endpoint API key things and there's so much more that I haven't even touched but just starting it up in the in the length of it that it took to make this video we're up and running so the one thing we would have to do is now okay so this keeps giving me a 404 it is what it is um this is great if you wanted to do something more than just have a Shopify and build your own thing and have it super flexible and change it and have it open source and make proved requests as a developer to this repo you can one last thought I personally think it's pretty cool that it's not a SAS product so I can just hack around in it and it's open source and you go for it on the other hand for the ease of use I would pay a couple of bucks a month for this thing to work in the cloud so I don't have to do updates for versioning I don't have to worry about scaling off my architecture I don't have to worry about security they'll do it I'll just pay a couple of bucks for a good SLA and I'll be good to go however it doesn't have that now but it might get it if there's enough people wanting it I guess anyways this was Medusa GS and this was Tim price and I hope you liked it and hope to see you soon cheers