ChristopherLeeMiller

Archives concerning all matters web development and beyond

From my Desk

October 2019 Month In Review

Published: 11/02/2019 | Time To Read:6mins

What's going on everyone It's Chris once again coming at you with my 'Month In Review' segment. What have I been up to over the last month both professionally, and personally are talked about in this bit? Without further ado, let's get started!

Website Changes

Quite a few things have happened over the last month, some have been great, some unforeseen, and others just frustrating but nevertheless progress pushes on.

Strapi — The Backend

StrapiJS released another amazing update that unfortunately broke the entire file uploads system as I had been using it, something that to this point is still being worked on as far as migrating content goes but we are making ground up on that.

One of the new features that were added in their v3.0.0-beta.17.4 update included was the ability to log in using a mutation GraphQL query, which of course had to happen after I had already written the auth segment using the normal REST API. I'm still probably going to migrate to this at some point but for now, this current method works and will be described later.

Front-end Changes

So the biggest thing added this month was authentication to the site. You might have already noticed the avatar top right of your screen (invisible if on mobile) and the ability to log in. Yes, I'm aware that it logs in as me and this was a goof on my part but it's been ok because nothing can be edited or seen that otherwise wouldn't have been able to before anyways.

To handle the authentication component I used a combination of Reacts new context API and also the new hook API to combine them to create a global state for auth. I ran into many issues on where and how to place this, and eventually found a working solution that I was happy with. To inject the auth provider begins in _app.TSX, nestled just inside of the Apollo provider and above anything relating to page content. This injects what I need to be able to handle further down the chain.

Then in my withLayout HOC(Higher Order Component), I placed the Profile component, which handles all things with the profile from showing an icon to login/logout links as well as eventually to the My Account page. This then pops a modal for login as needed and that is still being worked on.

In each individual page then before the render function, I pull in the auth hook where I can set if the page is secure, or if not as needed I can grab the auth state if there is something on the page that needs to be customized for that.

Right now though there are only secure and unsecured pages, nothing, of course, being secure because that wouldn't make sense with a generic login! One of the things I'm working on right now is the full-blown login form and modal so that I can keep progressing on this though. In addition and something I'm still working out is an authorization strategy to be able to say who can read/write on pages if they are secure and what they can read/write on those pages as well, but that's something I'll be addressed before long.

Contact Form

Another big key thing for me this month has been spinning up an email micro-service and offloading all email handling to that. The first thing to get refactored with this has been the contact form and hopefully, it's smoother now. One of the key benefits is I can pre-define templates on that to have a common header/footer and then just inject the content as needed into the middle of that, without having to clog up the front-end site. GO check it out! Contact me.

Other Things

Other things this month on the site have included various CSS tweaks as well as more GraphQL query tweaks to hopefully improve site load times. I've darkened up the red color just a hair to make it not so bold, I doubt anybody will notice but I think the new color is better.

Build Process

One of the things that has been annoying me for some time now is that whenever I've pushed code to GitHub, signifying I'm ready to begin testing I've always had to log into my AWS server and git pull, then npm install and build it before triggering PM2 to reload it and see the results.

With some research and a few days I figured out how to set up and use Buddy.Works to automate my build and deploy process both for dev and production. What happens is that when I push to the dev branch buddy will follow the process I described above so push those changes up for me automatically. When I push to master from dev though the same thing happens basically, in the production server. Already this has saved me considerable time and frustration and I'm glad such a product exists.

I do however need to figure out how to do this based on a Travis build so I'm not pushing broken code to the server.

To-Do

So what is on the docket for this coming month? In no particular order:

  • Login form
  • 3rd party Auth (Facebook, Google)
  • Linking front end content to the backend editor for quicker time editing
  • removing caching of content that's causing things to not appear
  • fixing filters on models

Personal Projects

Ok, I know that this is technically a personal project as well but I consider it to be professional as this is a tool for jobs for me. But personal side I've been working a lot on models, like a lot of time as Christmas is approaching very quickly and I'm running out of time. My niece's Christmas present is almost done, with my brothers behind that. My nephews though I've gotta get cracking on. Check them out in the model's section!

BTW board games are pretty freaking amazing. When i'm not coding, sleeping, or working my retail job I'm sitting at the table playing a good ole board game! Recent arrival Tsuro: Phoenix Rising looks to be pretty amazing!

Anyways till next time! Enjoy

Contact Me

Reach out today with any questions or concerns.

Follow Me

Be sure to see the latest and greatest

GithubLinkedInInstagramTwitterYouTube

Use of this site constitues acceptance of our Privacy Policy. The material on this site may not be reproduced, distributed, transmitted, cached or otherwise used, except with prior written permission of Christopher Lee Miller.

Copyright © 2022v1.24.8