• Skip to primary navigation
  • Skip to main content
  • Skip to footer

Jackie D'Elia Design

  • Articles
  • About Me
  • Portfolio
  • Services
  • Contact
Home » Articles, Tips and Tutorials » How improving my codebase is saving me valuable time.

How improving my codebase is saving me valuable time.

July 24, 2016 by Jackie D'Elia
Last updated on September 5, 2019

I’m always looking for ways to improve my efficiency. It’s better for me and the clients I serve. That’s why I’ve been on a mission to improve my codebase and work smarter.

I have a passion for learning and an insatiable curiosity to understand how things work, and why they do. I look for ways to improve a process by rethinking the entire approach, and am rarely satisfied with the status quo.

This post contains a few affiliate links for products I use everyday that are totally awesome. Here’s my full disclosure.

Looking back

Three years ago, I was slowly getting back into web development, after running my e-commerce store for ten years. I was building websites by customizing Genesis child themes through what now seems like a very inefficient process.

Let me describe it.

I would ask a client to select a child theme as the basis for the overall design. My work was primarily editing the functions.php and the style.css. I had a collection of random code snippets I used for projects.

Whenever I needed to create or modify something in the theme, I would hunt online to find another snippet. Many times I would copy and paste code that I did not fully understand, but it worked, and solved my immediate need.

I developed on a remote server, with a coming soon page enabled. I would edit the files locally and then FTP them to the remote server.

It was a slow process. Seeing the changes took several steps.

Enter a Local Development Environment

About two years ago, I rediscovered the world of developing in a local environment.

I started out developing locally in the early 90’s on my PC before the internet. Funny how things come full circle.

Enter DesktopServer, which made it super easy to run WordPress on my local computer. Once I discovered that, I quickly converted to developing locally and pushing my changes to a staging server.

Now I could immediately see the changes I just made on my local site. Clients could review the work as it progressed on the staging server. I’d push changes as I worked through the design and development process and clients saw only the work I was ready to show.

That was a big improvement in my workflow, saving me a lot of time.

Continuous Learning

I make time for continuous learning.

The past few years, I’ve been spending a lot of time on sites like Lynda.com and Treehouse.com. I highly recommend them as a place to learn the basics.

It worked. I honed my skills at using Git version control, Sass, PHP, basic JavaScript, theme customizing, writing plugins, SVG and vector graphics, working in the terminal and more.

I was now ready for the next phase in my journey.

Meet Tonya Mork

Last year, I watched a presentation by Tonya Mork in Genesis Camp titled Quality Code by Design (Youtube). Boy that got my wheels turning, and set me on path to improve my codebase and workflow even further.

Tonya and I had an opportunity to work closely together at the WP Developers Club last year, and I observed first hand how a true software engineer writes code and solves problems.

My Own Starter Theme

At the start of 2016, I adopted Utility Pro (no longer available) as my starter theme. It is a robust theme built with Sass, Grunt, internalization and accessibility.

Soon after, the idea of customizing other child themes just didn’t make sense for me. I was on a mission to design with my own codebase. I was transitioning from customizing themes to building handcrafted websites.

Why the change? Well for one thing, it’s a lot easier to maintain for clients. Everything going forward shares a common codebase that I keep updated. I wrote a post about why Utility Pro was my new starter theme earlier this year.

Every time I have to go in and edit a site built with another child theme, I have to spend time searching, reviewing, and getting reacquainted. That’s wasting valuable time!

Where I am now

I use LocalbyFlywheel for running my local environment.

Why? My child theme folder is my development folder and it has a lot of stuff in there that is not needed for deployment. DesktopServer does not have a way of choosing which files or folders I want to push to the server.

Instead, I use Migrate DB Pro to push database changes and images from my local development server to the staging site. It has a handy media file add-on that syncs your media files and only uploads the images that have changed. This saves a lot time when working on a large site.

I’m still left with copying select parts of the wp-content folder manually via SFTP, but even that is about to change. I’m now looking into using Git to push my deployment ready files to GitHub and then use a service to push that to my staging / live servers.

What’s next

I want to devote more time to being innovative with my designs and adding custom functionality to solve client problems.

To do that, I need to produce a finished product in less time with fewer bugs.

To that end, I’ve been working through the video content produced at Knowthecode.io.

This has been a game changer for me.

Genesis Developers

If you’re a Genesis developer and want to build your own modular codebase, Tonya shows you step by step how to do that using the free Sample Genesis child theme.

For me, I will be adapting my starter theme further by breaking up my PHP code into more concise modules, and creating configuration files to make it much easier to manage.

I’m organizing my Sass partials for my workflow and putting the power of variables to work. By placing all of my color styles into the variables partial, I now have just one file to edit to completely change the color scheme. I am no longer searching and replacing through that giant style.css file.

Tonya has made a profound impact on my code journey. Knowthecode.io is my go to resource for understanding the how and why of coding in WordPress. I am very grateful for that.

Knowthecode.io has a free trial period, and I would encourage anyone interested to take a look. It’s geared for those on a path to professional software development in WordPress.

It’s ideal for someone who really wants to improve their skills to be more productive and work smarter. As Tonya says, to “Be More Awesome”.

Wrap it up.

My code journey is just that, a journey. It’s a path of continuous learning, and one that will last as long as I am here.

What’s your journey been like?

TweetLinkedInFacebookPinShares49
Previous or Next Article
Previous Post: Letting Go of the Desktop Design MindsetLetting Go of the Desktop Design Mindset
Rethink.fm launches with Episode 0 Next Post: Rethink.fm launches with Episode 0

Related Posts

  • Why Utility Pro is my new starter theme
  • Adding a Retina Ready Logo to the Utility Pro Theme
  • Adding a SVG Logo to Utility Pro Theme

Filed under: Developer Tips, Genesis Tutorials, Workflow

About Jackie D'Elia

UX consultant and Web developer. I love writing code and sharing what I've learned. You can find me on Twitter @jdelia. I am the host of Rethink.fm - the forwarding thinking podcast.

Reader Interactions

Comments

  1. Ginger Coolidge says

    July 24, 2016 at 3:22 pm

    Thank you for sharing the ongoing code journey! I am so comfortable in code, I too love the modular approach and signed up for the Pro Plan on knowthecode.io. This part of tinkering is enjoyable, moving things around.

    • Jackie D'Elia says

      July 24, 2016 at 3:32 pm

      Thanks Ginger! Wow – KTC is where it is at. An awesome year of growth for both of us!

  2. Bharath says

    July 26, 2016 at 11:42 pm

    Hi Jackie,

    I’m improving my workflow for the past few months and now I have almost perfect dev setup that saves me a lot of time. I’m using VVV(Varying Vagrant Vagrants), VV (site creation wizard) and wordmove. I can push, pull between local, development and production environments by using a single line of command. Coming to the child theme, I created my own version of sandbox and using is as the base. I’m pretty comfortable with this setup and I can say it significantly helped me to speed up my workflow.

    • Jackie D'Elia says

      July 27, 2016 at 7:28 am

      Thanks for sharing your workflow, Bharath.

  3. Patrick B says

    July 30, 2016 at 3:16 pm

    Great article as always Jackie, thanks for sharing. I have had know the code on my list, just haven’t bitten the bullet.

    I hope you will let use know which git deployment method you decide to go with, it’s always interesting to know which ones people go with since their are so many options for various workflows. Last year I found a little Ruby script called Dandelion Deploy of github (https://github.com/scttnlsn/dandelion) that I have been using. It’s great particularly in situations with variable connection options. You just put a yml file in the root of your directory with the server information and it will push your last git revision to deploy only the changes. That combined with Migrate DP have made the process so much easier for me.

Footer

Recent Articles

  • AMP Stories in WordPress
  • Enabling AMP in WordPress
  • Adding SVG icons and graphics to your WordPress theme
  • Enhancing the SVG Social Icon Menu in Twentyseventeen

LinkedIn Learning

This is my favorite place for continuous learning. You won't be disappointed.


Free one month trial

AMP Powered

This website is powered by AMP. Now creating user-first experiences is easier. The AMP for WordPress plugin enables AMP on WordPress sites.

Connect

  • Twitter
  • Linkedin
  • Github
  • Dribbble

This website contains affiliate links and I may earn a commission if you use them. Learn More about affiliate links on this site.


Copyright © 2014 - 2019 D'Elia Media LLC, All Rights Reserved. | Privacy Policy

Hosting by WPEngine | Powered by Genesis Framework and AMP Project

This Site Uses Cookies

This site, like many others, uses small files called cookies to help us improve and customize your experience. Learn more about how we use cookies in our cookie policy.