Best Free Web Development Tools

Every time I have a new web development project, I make it a habit to create a prototype on my PC first. It speeds up work. If you are testing a possible solution, you save the code and just press F5. You can see the result immediately. There is no need to wait for the page to finish loading. Among the many Windows-based web servers available, I use AMPPS.

It allows you to create web applications with configurable Apache, PHP, and MySQL on your desktop. For basic needs, it is a complete package and comes with PHPMyAdmin.

One of the reasons why I like it is its ease of use. Download it, install it, and it’s ready to use. Everything is set up automatically. To start using it, go to https://localhost/ on your browser.

The second thing is that, unlike others of its kind, this one doesn’t have any port conflicts with communication programs like Skype.

Working with WordPress? Try Local.

Sometimes you think that your website is slow, when in fact it is your internet that is slow. To test internet speed, try Fast. It instantly gives you the details on page load. Of course, there’s SpeedTest. If you don’t like to remember these sites, just type “speed test” on Google Search, then click on the RUN SPEED TEST button.

Use DownForEveryoneOrJustMe to know if a website is down. If you need more details or your very “own” status page, try UpDownRadar. ShopifyStatus and CloudFlareStatus let you know if these services are down.

If you’re a web developer, it’s tough to create a website that’s responsive when viewed in different browsers and devices. CSS and JavaScript are normally used to enable sites to be device and platform independent. Below are some tools to test if they are indeed responsive and render according to your specifications.

To check how your site looks in different browsers, use BrowserShots.Org. As the name suggests, it takes screenshots of your website in browsers supported by various operating systems. You can select all and enter the URL. Take note that the more browser and OS combinations you select, the longer the process will take. It then displays the screenshots as thumbnails, and you have the option to view each online or download them all. It’s cumbersome, but the service is free.

If you like to test a website’s responsiveness on different devices, ResponsiveTestTool is highly recommended. It has a very user-friendly interface. To use, just fill in your domain and it will render on it the default desktop screen. The screen sizes are conveniently grouped into mobile, tablet, desktop, TV, and custom sizes. To test, click on the respective group and you will be presented with the different devices and their sizes. Selecting the specific screen size will adjust the size of the website and you can see in real time how it responds. The view is actually live and you can click on the links and even scroll. The feature that I like the most is the “Rotate Screen” which simulates the portrait and landscape views. I’ve used it on some of the websites I’m working on and it renders quite accurately.

Other services worth mentioning are ResponsiveDesignCheckerAmIResponsiveDesign, and MobiReady. Google’s Mobile Friendly Test just does what its name implies.

If using Blogger, see some tricks and tips below:

If you need to add an affiliate disclosure or any content at the end of every post, here’s a piece of code that will insert it without editing each one.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
.entry-content:after {
content: &#39;replace_this_with_your_text.&#39;;
}
</style>
</b:if>

Just copy the code and edit your template. Paste it just before the </head> and change &#39;replace_this_with_your_text&#39; with your own. Aside from text, you can use it to insert images.

To insert an image, change ‘replace_this_with_your_text.’ with url(replace_this_with_your_image_url). Of course, you need to change the replace_this_with_your_image_url with your image URL.

To disable Blogger’s own cookie consent notice, add this code before the </head>:

<script type='text/javascript'>
cookieChoices = {};
</script>

PHP is a recursive acronym for PHP: Hypertext Preprocessor. It is a widely used server-side scripting language specially designed for web development. As such, it is my main choice of programming language. Below are some of the best free PHP tools I’ve been using.

Want to retrieve the content of a website? PHP Simple HTML DOM Parser, it can find tags on any page using the tag selectors. It can even extract contents from web pages, including ones with invalid HTML. A very useful tool for scrapping.

A client of mine needs to add subscribers to his Aweber account via API. The PHP code examples use League OAuth2 and Guzzle. To make it easier for development, use Composer to deal with dependencies. Packagist is the main Composer repository. It aggregates public PHP packages installable with Composer. Here’s a clear instruction to install Composer in CPanel.

In some of my web development projects, I encountered debugging minified files like HTML or JS. Compressed files are impossible to work with. Luckily, there are lots of free online source code and data formatting apps. Below are some intuitive, clean, and ad-free formatters I’ve used.

Tools4Noons formats and beautifies HTML and PHP code, and they also have a lot of other useful tools. ExtendClass has XML, JSON, CSV, CSS, and HTML formatters, plus they have tons of tools, you can play with. Prettify codes with Prettier. It has no options, saves you time.

PrettyDiff is a unique tool among all others. On top of beautifying, it compares the difference between two files, minifies, parses tables and analyzes the code of popular programming languages. It has loads of settings and has error detection too.

Encoded data also poses the same problem as compressed files. To help check the innards, here is one and another one are good XML Viewers. JSON Viewer does what its name suggests. MotherEffin offers other tools such as a Base64 encoder or decoder, HTML Entities encoder or decoder, etc. HTML-Cleaner is a very useful tool if you need to convert certain tags or characters, or remove chars and empty tags.

SQL-Format of course, formats SQL code, haha. It provides lots of options and has an error detection feature.

As a web developer, most of the time I collaborate with a web designer or with other developers. Working on the same files can cause severe version issues. Version control software maintains document versions and tracks changes. Below are some open-source tools available that I’ve come across.

Apache Subversion (SVN) is a popular version control system, even used by Google Code for distributing their codes. Tortoise SVN is an easy-to-use interface for Windows PCs.

Personally, I use Git. It is a Source Control Management (SCM) tool with a lot of features, such as branching and merging. Unlike SVN which is centralized, it is truly distributed. However, compared to SVN, it is much more complicated. You can learn more about it at Git-SCM.

Mercurial is an easier, faster, and more efficient version of Git. It comes with extensive documentation and can support large development projects.

Being a lone wolf web developer, I have to be knowledgeable about as many things as possible, and that includes MySQL database administration. Two of the tools I’m using are Percona’s configuration wizard and query advisor. The configuration wizard creates a basic configuration file based on your requirements. The query advisor is used to troubleshoot a query. Both services are free, but you need to sign up first in order to use them. So far I tried the configuration wizard and the DB is holding up pretty well.

After you’ve setup and run your database, at some point you’ll encounter all sorts of problems. But even if you don’t have any experience, that isn’t a big deal. All you need is MySQLTuner. It is a Perl script that reads the current configuration, reviews it, and offers suggestions to increase performance and stability. I’ve tried using it on one of my projects and it worked wonders.

When I was assigned to transfer a WordPress website to another server, I encountered this bottleneck. The compressed WP database file is a huge 1.2GB! Uploading it via phpMyAdmin is causing the server to run out of resources.

Through searching, I’ve found SQL Dump File Splitter by Rusiczki that separates the DB’s structure and data. It then splits .sql data into several manageable parts. You just need to specify what file size each would be and it will take care of the splitting. You need to upload the structure first and then the data. Uploading the data files is a breeze as they are named in sequence. Even if you missed the order, you know that it doesn’t matter.

I thought this would be difficult. haha

Cron is a software utility present in any Unix-like computer operating system. It is used to execute commands at a specific time, date, or interval. These commands or tasks are known as Cron Jobs. These jobs automate maintenance or administration tasks like performing periodic backups, deleting or downloading files, etc.

Cron Jobs are stored in a configuration file called the CronTab (Cron Table) and can be accessed in the /etc directory. Only system administrators can edit it.

However, setting up a cron job is daunting, especially when dealing with scheduling a job. To get a deeper insight, read this beginner’s guide.

To help you get started, use the CronTab Generator. It has an easy to use language. You may then combine it with Crontab Guru which converts the cron job into a human-readable format.

Here’s a sample cron job to run a PHP script every day at 1:30 AM:

30 1 * * * wget -O – ‘https://sample-domain.com/sample-directory/sample-file.php?param=sample’ >/dev/null 2>&1

If the cPanel cron job is not available, use Cron-Job. It’s free. In WordPpess, if you don’t have access to your webhosting control panel, you can still access files and database using Advanced File Manager and WP phpMyAdmin plugins.

Did you know you can create a contact form using Google Forms? Use the Email Notification for Google Forms app to receive email every time you get a message. OpenWidget is a free contact form pop-up.  In WordPress, create forms with Ninja Forms and Contact Form 7.

BuiltWith shows you what services and platforms a website is using.

Did you know that WordPress(WP) powers 32% of the internet? It controls a whopping 60.2% of the CMS(Content Management Software) market! If you’re going to build a start-up website it will probably be a WordPress. It so happens that’s my specialty, haha.

One of the best things that made WP very popular is the plugin. It is a piece of software containing a group of functions that can be used to extend the features of the site. Hence, it is so easy for users to add functionality without knowing a single line of code. There are literally thousands available for free download at the official plugin directory. MyThemeShop also offers some free plugins.

Managing all of the plugins would be one helluva job, haha. Don’t despair, in order to make it easier to install the plugins, use a plugin manager and bulk installer like WPFavs. You’ll need to create an account on their site and create your favorites list. You can group the plugins together and install them in a few clicks. WPCore has the same functionality.

Web applications are very possible with WordPress, for example you can create a CRM using Zero BS.

For easy installation and development in your Windows desktop, use LocalWP.

Enable maintenance or under construction mode with Under Construction or Maintenance.

No need to edit your theme’s functions.php use Code Snippets instead. Easily integrate visual and functional elements using Shortcodes Ultimate.

If your theme doesn’t support excerpts, no problem. Enable it with Advanced Excerpt. Control what widgets are displayed on the sidebar using Custom Sidebars. Control the visibility of menu links via logic with If Menu. Header, Footer and Post Injections insert custom codes in the locations specified by its name. Use TablePress for what else? Tables, haha.

WP Auto Republish and Inline Related Posts just does what their name says. Better Search Replace does what its name says. Useful when changing from one domain to another or making mass edits to the content. A very nifty feature is the ability to review the changes before committing. Bulk Delete posts, media, users etc.

You’ll also be needing help to manage the plugin, theme and WordPress core updates. My preference is Easy Updates Manager. In case you encounter errors with the update, use WP Rollback.

MainWP is a multi-site management plugin, you can update the WP core, plugins and themes. Also backup and scan.

When migrating a WordPress site to another web host or domain, the best free plugin to use is WPVivid, which also has a staging feature. Other options are Duplicator and MigrateGuru. With both, the migration is being processed on their server, so there is no need to download files.

For website design, read Theme, UI and CSS Tips. Looking for JavaScript frameworks go to HTML and JavaScript Tools.

Hiring a web developer is difficult, and retaining them more so. A better solution is to hire an agency. They will handle the nitty-gritty details of hiring, managing, and retaining employees for you. Try this agency, and have fun with your very own digital team. Use my coupon code RIC to get 10% off.

Affiliate Disclosure: Post may contain links to affiliate websites, and we may receive a commission for any purchases or actions made by you on the websites using such links. Thank You.

Scroll to Top