Create a Personal Blog with Nuxt.js & Headless CMS (Ghost) - 1 of 2

A headless CMS is a backend for your blog that allows yourself and other writers to easily create posts, pages, etc.. without having to code the backend yourself.

In Part 1, we're going to focus on the UI design of our blog in Adobe XD (though, you can use Figma or Sketch too). We'll create a mobile mockup and a desktop mockup for the blog.

In part 2 (releasing in a day or two), we'll finish up the project by stepping into the world of frontend development and making it a reality in the browser.

Here is the Adobe XD link from the design featured in this video:

Part 2 is here:

Enjoy!

- - - - - - - - - - - - - - - - - - - - - -

Subscribe for NEW VIDEOS!

^-Chat with me and others

- - - - - - - - - - - - - - - - - - - - - -

Come to my discord server or add me on social media and say Hi!

[DesignCourse]

PS: I'm starting to wonder if YouTube is limiting my reach here, I would have had 600 views by now and 20 comments! Let me know how you got to this video, if you received a notification or not, etc!

[devingray]

I always knew you were good with design. I discovered you when I started learning GSAP, rediscovered you on Traversy Media, and now that I'm trying to learn Vue as a UI Developer for a new company, you provide me with the perfect practice project, even down to the fact that I wanted to create a blog for myself using Ghost instead of my usual WordPress. This tutorial is literally a God send for me. Thank you so much for this. I especially love learning about the design process and what goes through your head during decision making. I've always avoided the more creative side of design, but you make it not seem so bad. Now to get down to the coding!

[susell]

This was my first real Web design video in years and I learned a lot, both tools, concepts, best practices etc. Thanks so much for this!

[krisznitro]

It's amazing! Can't wait for the 2nd part .:)

[sukiantosuteja]

Thank you for making this video. I can't wait for part 2 of this project !!!

[zandanforth]

Thanks! May the web Gods bless u. I’m an old designer looking to refresh my skills and your channel hits the spot!

[eogutier]

This is literally, and I do mean literally, what i was looking for on google yesterday. Thanks!!

[alexandros-markovits]

Nuxt rocks! Waiting for the part 2 since i haven't tried Ghost as a CMS. 😃 But yeah making a blog or anything with Nuxt is awesome!

[marcusfelipe]

this content is very interesting, I would certainly like to see more things like

Thanks

[CarlAshfield]

I’d love to see more design to Nuxt videos! 🙌 ace work!!

[repiatx]

waiting for part 2 good work as always.

[GregGolias]

Amazing video! Thank you so much! Where and when we can find your app Gary?

[mikoo]

Can you please make a video on digitalocean? Thanks!

[eXWarCry]

Killing it man. Do you have a course on udemy or can I pay to shadow or get personal courses?

[reggielj]

How are you changing the font size by dragging your mouse? I'm on XD for Mac and can't seem to do it. Would save me a lot of time clicking and typing numbers. Great video btw, although the title is a little misleading since most people will find this looking for coding/development and this whole video is on design.

[shayansab]

I will be glad if you talk about receiving form data and save it

[furkanmutlu]

can you add link of the second part of the video ? it is not recommending, and really hard to fine

[IDALGAME]

I don't know much English, but you always showed how the example was made. And how did you later export from adobe XD to the site? is this a new feature?

[fictionstudios]

Will it replace the monster WordPress?

[CsabaKissi]

Is the DesignList app created in Electron? I was watching your Electron tutorial so I assume it was ;)