Hello and welcome to my colophon.
What is a Colophon?
I. Introduction
As a web developer, this colophon serves to benchmark the current technologies I’m interested in and respectfully using in the final development of this portfolio. As of September, 2024 ~ below is a summary of the technologies that are being used to hoist this thang together.
II. How it Works
Primary Domain: viafoci.com
Subdomain #2: tech.viafoci.com
A.
Domain
viafoci.com
Generally speaking, viafoci.com is operating as a “holding” company to my primary domain spaces. It carries high level info about my services operating currently as a single-member LLC. It’s meant to serve the artist and technologist within me and to sell my self as straight forward as possible to the world. THE plan is to sell artwork as well as subscriptions for technical consulting & batched development hours on another “shop” sub-domain, offering purchasable packages for both “new/active” project development across certain reservable timelines, as well as post-launch “support” contracts across certain reservable timelines.
Hosting & Registrar
I migrated the domain from Dreamhost to Vercel this year and setup web hosting aaaand the registrar for only $20 per yr (!) …. and I’ll tell you this – my current traffic can handle it. We shall see how Vercel does with scaling… For when that happens.
Vercel comes with pretty amazing DX, and I can push files from my local to the instance with a simple vercel --prod command in bash. Yee haw.
Frontend
Built in the MERN Stack.
a. Next.js
b. React
c. Tailwind
d. GSAP
Backend
TBH, the current “tech” sub-domain is a bit of a stomping ground. With that, it’s proudly using WordPress as a headless CMS, where I’m grabbing data from this subdomain that you are on (tech.viafoci.com) and using it in reference, on my primary domain (viafoci.com), via WPGraphQL – a nifty plugin that offers very easy-to-use plug and play API request data, being used in my Next.js JSX files via await fetch() request.
The portfolio “Case Studies” specifically… that is the work completed within the last decade, is data stored as Custom Post Types in WP, with default custom fields assigned in WordPress using
register_meta()*
and
'show in rest' => 'true'
to expose properly in the WordPress REST API and then requesting said data, inside the Next.js app. For it to work “proper” and get the CPT that “extra” custom data (ex: year of project, agency under contract with, title during project…),
I’m also using the register_graphql_field()*
function to ensure it’s exposed in the AJAX request.
Oh and it’s hard to say where this detail goes, but for a package manager,
I’m using PNPM in mini-favor currently to NPM
B.
Sub-Domain
tech.viafoci.com
Initially setup to be the “agency” side of my business, it’s now morphed to becoming more of a data store(age) space for password-protected, non-crawleable proposals as WP pages, random blog posts (like this one), and API calls (like as mentioned above under “Backend” for viafoci.com).
Built in LAMP Stack + teeny bit of MERN.
Hosting & Registrar
Frontend & Backend
This website you are looking at is using the TwentyTwentyFour WordPress.org default theme, cloned, with a CI pipeline setup. It’s a pretty remarkable theme for about a gazillion reasons, but namely I built this site with hardly any code, in a FSE Theme that I’ve customized using the theme.json file. I’ve built only a couple building custom blocks (the testimonials carousel on my contact page). Blocks have a bit of “classic” nature, though I’m also using some using modern scaffolding tools, in recent relatively historical years of WP development & awesomeness. So.. this current site it really is quite the hodge podge, and a “staging” or even testing ground for this business.
Fair to note here, I’m also using the recently released Block Bindings API which I gotta say, is a percolating and insanely incredible addition to the already fantastic code base that wordpress.org is. Did I mention I’m a WordPress fangirl?
C.
Sub-Domain
shop.viafoci.com
more coming soon! Check back later…