Matthew M. Jones

News

New MACH Matthew M. Jones Website

Share:

My new website, my new tech stack and my continued dedication to pixel perfect responsive design and Search Engine Optimization via Social Media Marketing.

The previous rendition of my website was launched in 2014. That version served as a demonstration of React, which I presented to my team at that time. It was, interestingly enough, seen as a mere technological craze. However, I did not share that skepticism, given the increasing demand for front-end positions listed on LinkedIn.

The enduring presence of React became evident, highlighting its necessity for drawing in new developers and maintaining employment within the technology industry. Fairly confident that we lost a couple pitches because of our reliance on object oriented vanilla javascript development and after a couple account losses, it eventually led to the dissolution of our team. Sometimes, one must recognize and adapt to the shifting landscape of technology. We were a day late and a dollar short.

The prime issue I did agree with my 2014 version was that it was an application as opposed to a statically generated site that could be indexed by Google. Consequently, it was unable to effectively integrate with social media marketing. In addition, its data was being managed with a manually curated JSON file, which was not something I could easily market to potential clients with little technical experience. I needed to decide on a modern CMS.

During that period, I was transitioning away from Expression Engine as a CMS and concentrating more on Wordpress and Drupal development. Wordpress templating had its merits but was infested with security issues. How many unsolicited Ray Ban sunglass offers can one bare in the comment sections of a post before you give up on the platform?

I will have to point out that Advanced Custom Fields, which I still believe, is the superior package for custom CMS curation and management, provided parent entry reference, a sticking point for me with Contentful and Contentstack. ACF has had that functionality for almost a decade now. It's aggravating to me this is still missing from MACH CMS providers.

Drupal was also the preferable choice for enterprise-level requirements, we used it on STX Entertainment and Jeopardy.com, but it was plagued by inconsistent documentation. Additionally, managing content was not a straightforward task without proper training and their template URLs did not align with SEO practices. Honestly, I've always thought that platform was trash. Saw an updated UI recently, still wasn't fired up to go back in that direction.

As it seemed, I have been for years gradually meandering into the MACH space, albeit unknowingly. I initiated utilization of the API in Wordpress and started to render out pages in PHP. This is where criticism from my team, who relied heavily on traditional and now, in my opinion, obsolete practices of utilizing the built-in templating of these monolith platforms, began to crop up. I caved under pressure and moved in that direction.

For the past 5 years I started and then stopped replacing my old React website. Wordpress? No, React and Mongo DB. I have to build out a UI? That sounds time consuming and cumbersome, no. Drupal? Not a chance. Ok, Gatsby and Contentful? This shows promise.

Then I get put on a NextJS and Contentstack project at Kin + Carta, which is the space we have been operating in for the past 2 years, providing no traction for my ever aging code base at home. Well, there is no free portfolio tier with Contentstack, which I have pointed out to our partners. So, that's not going to work for me personally either.

My dark mode inspired design stayed the same, but the tech around it began to evolve into what I am using today, a full MACH approach. Microservices, API-fist, Cloud native Sass and Headless. It's proving to be scalable for individuals, to small business, to enterprise level for clients with demanding traffic requirements.

Dark Mode Design

While working on the A Starting Point site, I found myself fading in the afternoon. Finding it hard to stay in front of my computer for extended periods of time. My eyes growing weary and having to step away and meditate. This wasn't helpful pushing points across the board.

My wife commented that I should get my eyes checked. Scoffing at the idea, didn't make the issue go away. So, I set up an appointment with an Optometrist. Well, after having fighter pilot 20-10 vision for my entire life, it turns out I needed computer glasses. Another life example that sometimes you should listen to your significant other and just do what they say!

Finding ways to mitigate my vision decline, due in most part to me being chained to my computer for most of my adult life, combined with the prevalence of cell phone use, I started to look into topics of blue light and high contrast colors contributing to vision problems.

After buying a new monitor and glasses with blue light protection, this is the aesthetic I chose to push in my redesign. No true black, no true white. Stepped black to white color pallets, utilizing them to show depth and importance, with a blue accent to give a little flair. After all, who am I, Tim Burton?

Contentful

The CMS platform I settled for is not one that I deem the best, but it is one that is cost-free. Contentstack has superior modeling capabilities, closest in resemblance to what Advanced Custom Fields offers. That said, Contentful remains a significant player in the enterprise CMS arena, functioning reasonably well and, importantly, it comes without a price tag.

My newest gripe with Contentful is that their CMS is not mobile responsive. I was trying to upload photos from my phone while on the road at a film festival. The UI is almost unusable and it zip files HEIC files, so you can't use it in a post without downloading it to your computer and exporting a jpg. Huge hole in their set up. I have not tested on the fly file upload from phone on Contentstack yet.

I find it very odd, considering you can use Contentful's image api to convert images on the fly to any major image format, yet they don't support HEIC photo uploads, the main image type saved on pretty much all modern mobile devices. Image Upload: FAIL.

NextJS

It appears as though the war for front end static site generation is at an end - NextJS has emerged victoriously, leaving Gatsby in its wake. Regrettably, I spent much of 2022 developing Gatsby. Be that as it may, this is the framework of preference as it harmonizes well with both Contentful and Contentstack. It also provides options for Live Preview, Static Site Generation, Server Side Generation, and Incremental Site Regeneration. The new App router simplifies static and dynamic route generation, with provisions for customized layouts for varied templates throughout your ecosystem.

Vercel

This was my maiden foray into using Vercel's platform, and for the time being, it's cost-free for my portfolio site. Granted, I do not post a sizable amount of content daily, so I might dodge having to pay any fees. This equates to a considerable annual saving compared to other platforms like Register/Web.com, BlueHost, or GoDaddy, potentially totaling over $300 annually. Even if a necessity arises for payment in the future, the setup's convenience and ease of use would likely justify the fee.

Register decided that they were no longer going to fully support custom emails and Google Workspace. My email just stopped working in May of 2023. After repeated calls to support over a 10 month period I just gave up on the company and their service. Another incentive to focus on building out a new website.

After a review of my Quicken it appears I paid out over $1000 in the last 2 years for 2 domain names, a SSL Certificate (that never worked), professional email (that I didn't want), plus hosting on an old Apache server. I didn't even realize the additional charges they were slapping on my credit card, it was borderline fraud, IMO. Word to wise, audit your ISP. They are probably gouging you.

I bring up my previous ISP to illustrate the modern approach of Vercel. Not only was it a breeze to set up hosting and environment details. I had my Google Workspce email MX records revised and up and running inside a couple hours. I was shocked how easy it was, then furious at how badly Register's technology is and the price I was paying. Smell ya later, Register. You've been banned.

TailwindCSS

TailwindCSS demanded some acclimatizing from me. Its inability to utilize custom rem values for Pixel Perfect layouts initially seemed to be a deal-breaker. Adjusting a measurement incrementaly by .1 was painstakingly slow. Having to update the tailwind config with custom values every time and then restarting your local environment. Slow, painful, not precise, not profitable, not going to do.

I do miss inheritance along with child and sibling targeting. It's much easier to troubleshoot and find components when you actually have class names attached to DOM elements. The TailwindsCSS tool set continues to expand and evolve making it hard to ignore as the industry moves in this direction.

Although, I cannot help but ponder if we, as an industry, are possibly adopting a crutch instead of understanding CSS workings thoroughly. One could make a parallel argument concerning React, Angular, or Vue. Regardless, the fact remains that the majority of developers use it, which simplifies recruitment challenges.

Github Copilot

Initially, Github Copilot appeared astounding, but now I harbor no fears that AI could usurp my job. It was unable to help me set up types for Contentful Rich Text - a problem that consumed an entire weekend. Both Contentful and Contentstack need to dedicate more efforts into enhancing their documentation. And I presume this lack of clear directions does not do any favors for Copilot's algorithm since neither of these products provide a solid TypeScript example. They would do well to increase their efforts in this area.

It is however, a handy research tool right within VS Code. Like I said before, it still left much to desire and didn't keep me out of Stack Overflow looking for answers, mostly to Typescript questions.

Typescript

Most senior-level developers are utilizing TypeScript. And it hasn't gained industry-wide adaptation because deciphering 3rd party typing is difficult, it stalls the production process, and one could argue that it turns projects unprofitable. We pin our hopes on upcoming IDE AI integration to resolve these issues, but presently, it is a challenging task. This is my 4th Typescript project and it's getting to the point where there isn't much discovery left on my skill set. Doesn't make it any less annoying when you are passing data sets down a component tree.

Open AI

Contentful now offers an AI Content Generator app that is powered by OpenAI. I willingly invested little over $10 for this utility. I'm uncertain about the potentially hefty bill for using this for my site content, but its convenience is undeniable. I do wish for a feature where I can adjust the level of grandiloquence in it's writing, as most of the generated content seems overly flamboyant to the point of portraying me as a creative technology Demi-god. Where's the "Take it Easy, Man" button? Geez, Open AI is a braggart.

Conclusion

And there we have it, that's the rundown of my new setup. After approximately 3 years of moving away from Monolithic CMSs and moving past inadequate React Applications, I am delighted to assert that this list is ready for enterprise level.

FTR: I wrote most of this article myself. I had OpenAI rewrite it. It basically plagiarized me and added some fancy words. "The Man Behind the Curtain" overwrote my Big Lebowski joke. That will just not do. AI clearly doesn't have a sense of humor yet. The "Witty" button was kind of dumb and not funny at all.

After sitting on this article for a couple days, I went back and rewrote it in my tone. I'm not sure why everyone is freaking out about AI, sometimes even myself, because it's not much of a programmer, not much of a creative writer and not even close to being a comedian. Keep trying, Nerds.

Recent Photos View All

Matthew and Daniel J. Pico at pitching The Tie That Binds at the Marche de Film.Cannes Film Festival Outside of Filmapalooza 2024 Lisbon PortugalFilmapalooza Red CarpetReasonable Doubt Cast and Crew on the red carpet at Filmapalooza 2024, Lisbon PortugalWisconsin 48hr Crew on the red carpet at Awards Night for Filmapalooza 2024 in Lisbon, Portugal. Receiving our Yes We Cannes Finalist Award with festival director Mark Ruppert

Recent News View All