DEV Community

loading...
Cover image for Pt 1: Needles to Nuxt: Building a Website for a Tooth and Nail Tattoos

Pt 1: Needles to Nuxt: Building a Website for a Tooth and Nail Tattoos

drewclem profile image Drew Clements Updated on ・2 min read

If you know my story, you know my previous career was as a tattoo artist. I've been given the opportunity to build a website for one of the shops I worked at previously. They've recently came under new management, rebranded themselves, and want to set their new name completely apart from their previous selves.

I have a lot of freedom with this project, and also a lot of ideas that can make it a great learning and growing opportunity for myself. I figured this would be the perfect project to document the process as I think and build through some of those ideas.

Before I ramble anymore, here's the design. I called myself channeling my inner Jack McDade as I tried to create something that was pleasant from a user-experience, but with some unique/creative edge. Did I hit that mark? I'm not sure- but this is going to be fun to build either way!

If you're on Twitch, follow me here, as I intend to stream some of the development.

The Tech

I'm using tools i'm familiar with for this project to keep from having to learn additional things as I try to build the functionality I have in mind. So here's the stack:

  • NuxtJS (front-end)
  • Tailwind CSS (styling)
  • Firebase (database)

The Idea

My oh so (not that) clever idea is to try and build a micro-cms throughout the site, powered by Firebase, that allows them to edit some content in the same view as the live page. AKA, they won't have to visit an admin dashboard and jump through tabs and submenus to edit the content. Hopefully, they'll be able to simply visit the page in question, hit the edit button (if they're logged in as an admin), and edit the content inline where it sits.

Again, I'm not sure if this will work, or how-- but i'm familiar enough with Nuxt and Firebase to give it a good college try. They won't have full-blown editing powers. They won't be able to add new pages or navigation items.

Here We Go

So stay tuned to this series for updates and progress reports. As I said earlier, this is pro-bono project, so I'm not sure that there will ever be a steady cadence to these writings.

With that said, let's have some fun and see what we come up with!

Discussion (0)

pic
Editor guide