November: Funding Platform
I was pretty hype for this challenge, and I haven't stopped coding--I swear! I am still alive!
But here's the thing.
I failed.
I failed big time! It was a heck of a ride so here's a rough recollection of what happened and what I learned...
Journey Begins
First of all, I was crazy to think that using PUG.js and TailwindCss within a Node App was going to be efficient. There was so much friction when trying to write a page in Pug that it could have started campfires! I'm used to writing HTML, but Pug was really abstract and barebones--both a pro and con.
That slowed me down tremendously, and I ended up dreading working on this project. Here was my workflow:
Code in play.tailwindcss.com to make components and pages.
Use the above HTML paste it in an online HTML-To-Pug converter.
Paste the converted HTML in my project.
The tools I was using with the scope of the project and given my time crunch meant that I would have to either drop features, drop scope, or drop out. I was not about to purposely fail on the first month!
Trapped in a Time Sink, and the no Backend Valley
I came to the realization that I was not at a pace to be successful for the month, so I switched to CRA and started from scratch. I opted to stick with TailwindCss as my primary styling tool. Now that I was using react, I really wanted to have toasters in the app.
I found a codesandbox by Erik Verweij as an example and incorporated it. I was pretty proud of the result, but all that work was for not.
After switching to React, I really wanted to use Google Firebase for Authentication and Firestore as a database. So, naturally, I **nuked ** my backend and went all in on Google Cloud Services.
Pfft, that was a huge mistake!
It was another source of friction. I had to stop development to take a small crash course on Google Firebase and that still was not enough to convince me of sticking with it.
Do I use cloud functions for everything? Do I throw in endpoints to spice things up? As a new dev and after countless hours wasted, it hit me. I needed to chain Firebase Authentication with a Cloud Function to make a user on the Firestore Database. By now, it was getting close to Thanksgiving time, and I had a crummy frontend and no backend. What was I to do?
The React Wizard, Ben Awad, Saves the Day
If you haven't heard by now, Ben Awad dropped a free Fullstack React + GraphQL + TypeScript & More Crash Course on YouTube. As great as it is, I had put it off for a hot minute because I thought it was too long and it was in typescript.
I put those thoughts aside, and cranked it out under a week. I had a great Thanksgiving, too! Eventually, I was able to successfully host the frontend on vercel. After spending an entire day trying to get the backend to work, I managed to host it on heroku to keep costs down while keeping the cookies working between the frontend and backend. I plan on writing or making a video on it later.
Reaching the top of the mountain, but only half-way there
~Dr. DisRespect
November's Conclusion
In my original post, #12projects12months And My Fullstack Dev Challenge my goal for these projects was to learn new tech and build something original using that tech.
Thanks to Ben's crash course, and Leigh Halliday's Youtube videos I feel more comfortable with Typescript, Next.JS, and creating a GraphQL server.
What I ended up with
# Front End in Typescript
- Next.JS / Chakra-UI / Apollo Client / Stripe
# Back End in Typescript
- Node / Apollo Server Express / Type-Graphql / TypeOrm & Stripe
TL;DR
I failed to ship anything given the time. Trashed my backend to use Firebase--that was a hot mess. Watched Ben Awad's 14-hour crash course and shipped that, so it's all good.
Theme for month 4: February 2021
DevDesk Queue
Tech Stack, I want to use:
# Front End in Typescript
- Next.JS / Bulma / React-Query / Stripe
# Back End in Typescript
- Node / Apollo Server Express / Type-Graphql / TypeOrm
That’s all, folks. Thank you for getting this far! I will be busy with university, code bootcamp, family, and now this! I'll make posts with updates in the following weeks, good luck, and happy hacking!
Photo by Markus Spiske on Unsplash