Just Enough Git: Publishing

Welcome back! To recap where we’ve come from in Just Enough Git – we’ve set ourselves up, and we’ve learned how to create a repo and commit our work. We’re going to pick up where we left off with our dwc-playground repo and get that thing up on the internet!

This is a key part of the Design With Code process. With these superpowers, we can work, iterate, and get higher-quality feedback faster. Also, it feels great to have virtually no barrier to getting your work into the world. This one will be quick…

Push to deploy

Some years back, new companies started cropping up that recognized that the process of shipping websites was a total drag. “What if we could use Git to deploy code?” they collectively wondered, and the world hasn’t been the same since. Many of these services have generous free tiers and, when the time comes, are absolutely worth the money.

There is a healthy amount of competition in this space from companies like Cloudflare, Netlify, Render, and more but we’ll be using Vercel for three reasons:

1. The setup experience is fast and amazingly good.

2. They have innovative features, including a Figma-like commenting system to help you gather and respond to feedback.

3. I like their aesthetic. Design matters – deal with it.

Ship it!

Grab your GitHub credentials and make sure you’ve pushed your repo to GitHub. It’s time to ship!

1. Sign up for Vercel using this link. Or go to Vercel.com and click the Sign Up button.

2. Click on Continue with GitHub – you should see something like this:

   

   You may be asked to authenticate with your GitHub information, or if you’re already logged in, you’ll be taken to your new Vercel account immediately.

3. The next thing you’ll be asked to do is import a Git repo. If instead you see a dashboard, click the “Add New…” button and select “Project”. Either way you should end up here:

   

   I have lots of repositories, but your list likely only has dwc-playground in it. Click “Import” next to the project name.

4. Smash that deploy button! Vercel is smart and will look at our repo and figure out what to do:

   

   After a few seconds, you’ll see a screen like this:

   

   If you click on the screenshot, you’ll be taken to your brand-spanking new website. 🎉🎉🎉

5. If you actually did click the screenshot, go back and click “Continue to Dashboard,” where something like this will greet you:

   

   You can always come back here to see what’s going on with your project and update the domain, and other goodies like that.

That’s it – you did it. Now, whenever you do the commit dance and push to your repo, your changes will instantly deploy and be available at that same URL. You can change the URL and even add a custom domain. But I’ll leave that for you to figure out, you resourceful person.

Give me some feedback!

Who’s out there? Is this working? Should I keep going, or should I spend my Sundays doing something else with my life?

Please, let me know by emailing me at dan@perrera.com with your favorite gif and answers to these questions three:

1. Have you been following along?

2. Is Design With Code what you thought it would be?

3. What do you want to learn next?

I’ll give it to you straight – if I don’t hear from enough of you, I’ll likely sunset this version of DWC and figure out a different way to enable designers with the power of code.

Thanks for reading!