simple steps to develop with WordPress faster

For the most part, these are relatively simple changes to implement. The interest for me is to do it regularly.

Usually I do this exercise before starting a new project.

Here is an overview of what has been done recently. The goal is to attract your curiosity on these points without going into details.

Custom Website Development in UAE

1. Harmonize the handling of projects with Make

The tool make allows us to describe a set of actions common to all our types of projects. So, using make dev starts our development environment, make install installs dependencies, etc. and this for our Word Press, Laravel, React Native and other projects.

I find it very beneficial to be able to provide each project with harmonized, self-documenting orders that are easy to share within our team.

2. Static analysis of the Sass code

We already use Prettier for Sass and JS, which allows us to have a lot of consistency in our style of code. To go further, I configured style lint which allows you to check the entire .scss files of our project against a list of rules.

This allows us to be notified when any of these rules are broken.

CSS being an extremely permissive language, it quickly happened to build confusion into the code. To strengthen the strength of our code, we use the BEM convention .

Custom Website Development in UAE

This has been entered in our Make file we are using make lint to perform this task.

 Automatic increment of the version of JS & CSS files

The CSS and JS files served to the Internet user are cached by their browser. So when we update these files, we need to invalidate the cache so that the user can see the change.

To do this, all you have to do is add a version number in the url parameter of the file (https://mysite.ch/styles.css?v=1.0.3 for example). By updating this number, the browser will refresh this resource.

We were doing it by hand, there was only one variable to change to do this. It is a task that should not however be forgotten to do and the interest of the manipulation is very low, therefore, we automate!

This has been entered in our Make file, we are using make build to perform this task.

Custom Website Development in UAE

 Automation via git-hooks

Git allows you to perform various actions (git-hooks) occurring during manipulation of the project.

We are interested in these two:

pre-commit : before adding any code to the project, we automatically perform the static analysis of the Sass code. If the result of the analysis is not good, the code cannot be added to the project and must be corrected. This make lint is who is being executed at that precise moment.

pre-push : before sending the code to our repository, we automatically update the version of the JS & CSS files. Here it make build is who is executed.

The problem is that the hooks are not specific to a project, but to each machine. To be able to harmonize the use of these hooks for all developers, we used Husky .

5. Mailcatcher

Addition of the Mailcatcher service to test emails locally with more ease by intercepting them without sending them further.

This allows us to work with emails configured for production without worrying about polluting our customers' mailboxes with our tests.

6. Apache configuration

We still use URL rewrite. This requires enabling url rewriting in WordPress, then creating an .htaccess file.

In order to avoid having to create the .htaccess file to activate URL rewriting each time a project is started, the configuration is written directly into the Apache config.

Then, our site creation script activates url rewriting.

7. Sample images

Sample images are directly available in the media gallery. This allows us to test components using images more quickly without having to choose images.

Are we not good here?

More speed, more consistency, easier to transmit knowledge, all this brings a lot of comfort to our team. Of course, that's nothing extravagant, but it's a job that shouldn't be overlooked.

Regularly making this type of improvement is a great strategy to stay on top and requires relatively little effort. 

Best and affordable SEO Packages in Pakistan offered by DMT Lahore to ensure maximum search engine visibility & traffic to your website.