+44 0330 223 3428
Call Us
+44 0330 223 3428

Mark Jaquith: Making ScoutDocs: Build Tools

Mark Jaquith: Making ScoutDocs: Build Tools

Continuing my series about ScoutDocs and the process of building it, this week I’m talking about Build Tools.

What is ScoutDocs? ScoutDocs is a WordPress plugin that adds simple file-sharing to your WordPress site.

Coding in React involves JSX, a bizarre-but-wonderful XML syntax that you dump directly into the middle of your JavaScript code. It feels exquisitely wrong. Browsers agree, so your JSX-containing JS code will have to be transpiled to regular JavaScript. This can involve using a complex maze of tools. Babel, NPM, Webpack, Browserify, Gulp, Grunt, Uglify, Uglifyify (yes, you read that right), and more. You have decisions to make, and you will find fierce advocates for various solutions.

For ScoutDocs, I decided to go with Grunt for task running, because I was already comfortable with it, and I needed it for grunt-wp-deploy. Use a task runner you are already comfortable with. Even if it is just NPM scripts. You’re learning a lot of new things already. It’s okay to keep your task runner setup.

Next, I had to choose a JS bundler which would let me write and use modular code that gets pulled together into a browser-executable bundle. After deliberating between Webpack and Browserify, I chose Browserify. Webpack is really complicated. It is also very powerful. I recommend you avoid it until you need it. I haven’t needed it yet, and found Browserify to be easier to configure and use, even though it’s a bit on the slow side.

As I was building ScoutDocs and tweaking my dev tools, tweaking my Grunt file, and writing code to search/replace strings etc, I began to feel like the time I was spending too much time on tooling. Was I becoming one of those people who spend all their time listening to productivity podcasts instead of… being productive? I can see how someone could get sucked into that trap, but putting a reasonable amount of time into configuring your development tools can pay dividends for you beyond simply the time saved. It can also prevent mistakes, keep you in coding mode more often, and increasing your confidence in your code builds. Spend the time up front to make your tools work for you.

Other posts in this series:

 


Continuing my series about ScoutDocs and the process of building it, this week I’m talking about Build Tools. What is ScoutDocs? ScoutDocs is a WordPress plugin that adds simple file-sharing to your WordPress site. Coding in React involves JSX, a bizarre-but-wonderful XML syntax that you dump directly into the middle of your JavaScript code. It feels exquisitely wrong. Browsers agree, so your JSX-containing JS code will have to be transpiled to regular JavaScript. This can involve using a complex maze of tools. Babel, NPM, Webpack, Browserify, Gulp, Grunt, Uglify, Uglifyify (yes, you read that right), and more. You have decisions to make,…

Source: WordPress

Related Post
WPTavern: Apache NetBeans is Now a Top-Level Project of the Apache Software Foundation

WPTavern: Apache NetBeans is Now a Top-Level Project of the Apache Software Foundation The Apache Software Foundation (ASF), a non-profit corporation of decentralized volunteers from the open source developer community, has officially approved the NetBeans IDE as a Top-Level project. NetBeans joins more than 350 other open source projects and initiatives managed by the foundation […]

Read more
WordPress.org blog: WordPress 5.2 Release Candidate

WordPress.org blog: WordPress 5.2 Release Candidate The first release candidate for WordPress 5.2 is now available! This is an important milestone as we progress toward the WordPress 5.2 release date. “Release Candidate” means that the new version is ready for release, but with millions of users and thousands of plugins and themes, it’s possible something […]

Read more
BuddyPress: BuddyPress 4.3.0 Security and Maintenance Release

BuddyPress: BuddyPress 4.3.0 Security and Maintenance Release BuddyPress 4.3.0 is now available. This is a security and maintenance release. All BuddyPress installations are strongly encouraged to upgrade as soon as possible. The 4.3.0 release addresses nine security issues: A privilege escalation vulnerability was fixed that could allow users to “favorite” activity items to which they […]

Read more