hey it's Matt here and today I'm going to show you how to connect cursor and repet this is something we've seen quite a bit of demand for uh and I'd like to give a big shout out to one of our users on X who shared a tutorial on how to do exactly this last week and that largely inspired the tutorial I'm about to show you um but I'm going to go a bit beyond connecting these two technologies I'm going to talk about why this is important I'm going to talk about the types of development flows
that enables and lastly I'm going to share some tips and tricks that I've discovered along the way that might help you make the most out of this process um and one thing I want to call out before we jump in is that this is not exclusive to cursor or vs code for that matter this is enabled in any editor that supports connecting through SSH um and that also means any terminal that's right you can open any terminal you want and connect to your reppel so I don't want to keep you waiting let's jump right into
it we're going to talk through the process step by step so we'll get started by creating a reple and you're probably familiar with the repet homepage we're going to create a blank reppel and we're going to call it SSH tutorial um of course this will work with any repple uh it doesn't matter what languages you use we'll talk a lot about configuration in this video and exactly what's going on um but this is the default page we're going to get started by opening a new tab and we have this SSH tab here um and so
you can see we've actually added buttons for oneclick connections to vs code or cursor there's actually a little bit of setup we have to do before we click these buttons so first I'm going to head to the Keys uh paint and I already have a key but I'm going to delete that one and we're going to start from scrap I also removed all the files on my computer uh that configure this connection um so there shouldn't be any worries there that uh we're missing something so I'm going to create a new key we're going to
add a label the label should um identify ideally the device you're connecting from uh so Matt's MVP MacBook Pro um and then I'm going to need to generate an SSH key uh and so we have some guidance here on how to generate that I'm on a Mac and this is how you generate the key on the Mac I believe it's the same for other devices um but we also have pages in our documentation which will be linked in this video um where you can read more in-depth instructions or really geek out on this stuff but
if you've ever configured uh GitHub repository or configured git to connect to your local machine you've probably done something pretty similar um so that is the same with this process so now I'm going to head over to cursor and I'm going to open a new terminal and in this terminal I'm just going to paste actually let's make this a little bit bigger in this terminal I'm going to paste and run that command now I'm going to get a key this is sensitive so don't go sharing this with people kind of like I'm doing on this
video right now um but I promise you this will be deleted by the time you uh you see this video uh so I'm going to paste this into my SSH key and I'm going to click add key now an important point is that this is account level which means that doing this process like you really only have to go through this process uh the process of creating a key and linking that key once for your entire account from now on I'll be able to connect to any repple that is under my account um so that's
nice and there's actually just one more step we're going to have to do here so this is all available in our documentation if you're on a Windows or Linux machine things might be a bit different so i' check those out but on a Mac um I'm going to go to SSH which is the root uh folder for my SSH files um we'll list the files there and then I'm just going to Nano into this config uh and that's kind of because I'm lazy and I don't want to edit this file with a text editor but
I'm going to paste the following configuration that's going to add repet uh dodev um as the identity for this file um and then that's will allow us to engage with cursor uh in the browser so I'm going to hit contrl X Y enter to write that clear that out and we should be good to go so now really all we have to do is Click launch cursor and we're going to hit open and you're going to see in cursor um some warnings some messages like this looks a little scary but really it's just saying hey
repit dodev is reaching out and it has this fingerprint um these are the hosts and URLs Things Are coming from we configured all this we initiated this connection there's nothing to worry about we're going to click continue uh and you're going to see in the bottom right you're going to see on the left uh VSS code is downloading some things right cursor built on vs code and configuring SSH really only takes a few seconds uh until you have uh a directory listed um and again we get the contents of our reppel so I really want
to drive home like what is happening we have our reppel file system uh accessible now through this connection and um this is huge right right because it means that we get access to all the features of cursor and everything I'm doing here you know if I'm type if I type LS that's actually going up to my remote going up to my reppel executing that command and returning to me um now something we worked pretty hard on uh for the last couple days um something I'm really uh excited about the engineering team was really excited about
was enabling our tools over SSH so the thing that's great about repet is that we're developing in our deployment environment right this is a remote environment and you know it it comes with its own own compute power you can see that if you click the reppel resources right so this repple has a four core CPU with 8 gigs of RAM if I wanted to change that and make it 16 cores with 32 gigs of RAM I could do that and now I'm developing on a really high-powered machine right and so when I execute these commands
they're going to be executed in a remote environment on a machine with a lot of power um and that's really great the other thing that we get the other kind of unlock here is that we get access to repits tools for installing and managing both both languages and Frameworks so in the Shell remember this is a blank reppel if I type npm um npm is not installed but repit knows that and it's going to prompt us over SSH if I want to install mpm so I'm going to hit Y uh and now the environment's been
updated it reloaded the shell and if I type in npm um that's the command right that I would get for running an npm command so we just installed note and through this experience it's pretty much identical to installing it on your local machine or having it accessible from this directory except I didn't have to go through the whole headache of installing NVM and configuring a version uh and figuring out what I'm doing ex right and figuring out how to install it uh for my operating system and all that um so this is really powerful right
and if we wanted python here um we could install Python and now we have python 310 installed uh and oops exit and if we wanted python 312 installed right I could go to repet change this to 312 save that um I believe I have to refresh there you see environment rebuilding in the background now if I type python whoops I might have to reload this one more time now I have python 312 so I really don't know a simpler process for installing python other than what I just showed you so that's great right I have
this remote environment that I'm connected to it's running in the why does that matter well it matters because now I can use all the great features that I love about cursor all the great things that I love about my local development environment to build in an environment that I know will be the same as what I'm going to deploy if you've ever built with versell if you've built with Cloud flare or Railway or any of these other tools they're really great but you can create something that works on your machine push it you know to
a repo to build to deploy whatever and it doesn't work and it's kind of complicated right so the process I'm going to show you here is really simple and really straightforward um I'm actually going to use cursor and uh in this directory I'm going to say um create a v react project um with typescript and this is using cursor's terminal um editor and so it knows the command and this is going to uh create that um oops create that application using uh the create uh V command and so you can now I see I have
my react app I'm going to CD into my react app and I'm going to ask it to recursively move all these files up One Directory just so I have them in the root directory and I find you often has have to ask for DOT files too otherwise it'll write a command uh whoops I didn't actually type that in the uh chat prompt um otherwise it'll uh it'll just on the command without moving those like typically Secrets files up um so I run that now all the files that were in that directory are up One Directory
I can uh delete that folder um deleted and then I can CD do dot to move up LS make sure we have all the files there I can run uh mpm uh install to install the packages in package.json again these are being installed to the repple not necessarily my local workspace and now you're probably saying okay cool um so you did this you kind of created a project what's going to happen when you click run right because typically when you click run in a repple it's running on the reppel itself and that's where you get
that web view you have access to like see what you're running well let's take a look at what happens mpm run Dev um you're going to see we get a notification that uh there's a port available so you can open that like in your browser or you can preview it in the editor I'll preview it in the editor let's see what we got we have a basic V react project this is the boil plate when you create a new project and so this says Local Host 5173 that is relative to the repple so this is
actually running on a repple in the cloud we're accessing it in our browser um or in the editor here really and it comes with all the great features that you would expect right so um react if I did like a Emoji here give it a little wave um we're going to get hot reloading so again this is going to the reppel back to our uh our local machine and previewing in the browser um and yeah this is a really great development flow and so you could imagine right uh if I did like a new chat
here in cursor and I said write me a beautiful to-do application um with nice uh drop shadow and animation right this is all of the great stuff about uh curser that everybody loves is like kind of the code generation granted we also do have code generation with Claude uh Direct ly in the reppel um but if I'm showing you a sample cursor flow right I'm writing this app um it's going to give us all the code I'm going to drop that in here now that doesn't look very good but that's because we also have some
CSS we'll drop the CSS in looks much better um and it doesn't have any external libraries right that was a one-hot prompt we didn't have to install any component libraries but for like 5 Seconds right now I have this application um again uh if you haven't built and deployed on repet before you might be saying okay well you know that's great now we're doing the same thing but it's virtualized right it's running in some container um so imagine uh installing complex dependencies so let's take this and deploy it right let's make it live on the
internet um if I head on over to rep here and I create a new tab I'll go to deployments um since this is a v app it would be a static deployment I'll set that deployment up SSH tutorial Matt that looks fine to me uh V apps build to the disc directory so when you're creating a static app it's just a collection of HTML files and so you'd run npm run build to compile those HTML files and those will go to disc and then we're going to deploy that disc directory with repits static deployments and
that's typically how you deploy um this type of application some types of next applications if they don't have a server or they don't have a backend um and quite a few other you know there's some python static Frameworks that are starting to to be popular um as well so right the flow is I'm connecting to this external environment I'm installing packages I'm configuring everything in the cloud um and then I'm building and it actually looks like we got an error so uh repet has uh deployment repair uh it automates um kind of some of the
errors that you might see in deployment so it's saying react is declared but it's never read in Source app. TSX so let's take a look so this is probably a typescript thing right where like you can't just like declare it we can actually run that in uh repet take a look so if you don't see output you typically have to check the networking tool and make sure it's uh open on Port 80 um we can do that really quickly okay so there's some differences right with like dark mode and the CSS we won't get into
that uh but now we have something that works um we can go back to deployments uh we can uh click redeploy and now this is going to recompile again like AI is assisting us throughout this entire process so uh in that sense this development flow looks a lot more like being a product manager than somebody writing code right I kind of had an idea in my head of what I wanted to build uh I tried to build it cursor helped me build it repet helped me uh fix the deployment fix a little bit a bug
that was maybe introduced by Sonet and now we have something that's deployed so if I click this link um I get my Tod app this is on its own website this is deployed live um you can imagine doing this with something quite a bit more complex I have a lot of tutorials on how to do those sorts of things so I'd recommend checking those out uh connecting through SSH to something like cursor enables these really Advanced development flows um not just because uh we get access to all of cursor's tools and features but because we're
developing in our deployment environment um and what that means is that you'll never have dependencies that are out of sync because the environments are the same uh and that development and deployment parity uh if you will is really important um for creating things fast for creating prototypes uh but also for developing applications that you know are easy to build and troubleshoot um and so this is a really great setup I'd highly recommend checking this one out and I'd highly recommend comparing it to other deployment providers I found this to be one of the slickest flows
um especially when I looked at things like Cloud flare versell Railway Etc uh so give this one a shot I think it's kind of next level in my opinion but hey I'm biased uh again I'm not with repet this has been connecting to a reppel with SSH um until next time peace [Music]
