Before implementing a website, having a determined strategy and design guidelines is essential.
In order to make the design process fast and simple, the blog website was built in WordPress.
Before I joined the project, mockups and design concept were already formed.
The next step was to set up a working environment, customise directory structure and add necessary libraries. For an organised process of writing CSS we chose Sass, which, among other features, enables nesting and working with variables.
Gulp was used to automate tasks such as compiling, minifying JS and Sass and copying files to build folder.
Main gulp commands:
- gulp.task – define new task with callback function
- gulp.src – contains file paths
- gulp.dest – define destination path
When the development environment is set, we insert some testing posts and begin building and customising.
MailChimp is an email marketing service, which allows embedding a customized form to a website. To avoid redirection to their website after submitting a form, we can use AjaxChimp – jQuery plugin and modify the form to submit using Ajax.
After having the core functions shaped, we can extend it by adding additional parts. Since the majority of posts are technical, it’s necessary for the code to be syntax highlighted. For displaying code snippets we use CodeColorer plugin. Enabling discussions was simply added through a Disqus embed code.
Lastly, we can start contributing content.