Tips for clients when choosing a web development company

A while back I wrote a post about tips for freelancers …

http://www.jamesbarnsley.com/site/2016/11/27/tips-for-freelancers/

My goal at the time was to later write an article on tips for clients choosing a web development company. I thought at the time this would be a straightforward article to write but the more I thought about it the less straightforward it become.

Some typical indicators to decide whether a company is worth choosing could be as follows, How many employees does the company have? Are the companies premises any good? How long the company has been in business? Does the company have a decent looking website?

The majority of the above indicators are really indicators as to how well the business is doing. A lot of people will except that if the final product looks and feels right and it works then they are happy with the final product. With a large number of people accepting this as the basic premise most businesses can survive for a long time on this premise.

So what is it I am getting at here? In short, it is the underlying code powering the web development project. It is this area that as the client you will have no ability to judge without programming experience.

Neither did any of the previous clients of the long standing businesses, so the business may be big, the business may have been around for a long while but this does not mean that either you or the previous clients ever got a good product in terms of the code powering the web development project.

How the product looks and to some extent whether the product works or not is merely a coat of paint over the real engine powering the web development product.

A Ford car can look and work right, a Rolls Royce car can look and work right but both have huge differences in the price tag. How do you know whether you are getting a Ford or a Rolls Royce? The quality of the components? In a web development project whilst some of the components may stand out such as the design, some of the components do not stand out i.e. the code.

This article has been born from observing different web development projects with different qualities of code being sold at vastly different prices. The higher priced projects do not nessacarily equate to higher quality code although the project may be of a better quality in other areas.

As a client how can you ensure you are getting quality code? I have thought about this and I am not sure there really is an answer. You could get a programmer contact or external company to inspect the code but then how can you be sure that the external company is any good at programming code, especially since the same applies to the external company which applies to the primary company?

Conclusion
As a client without programming experience maybe it should be excepted that if the company can produce a product which “looks good” and “works right” then the company is acceptable. The quality of the code is hard to determine for the general client and getting the code verified by a third party simply means you have transfered the trust from the primary company to the external company.

Select2 library solution in Yii2 part 4 – retrieving the data

To continue on from the previous article I wrote about saving the Select2 data …

http://www.jamesbarnsley.com/site/2016/11/07/select2-library-solution-in-yii2-part-3-saving-the-data/

I will now talk about how to the retrieve the stored Select2 data so that the data can be displayed on the front-end Select2 field. Following on from the Task / Countries example, place the following “loadSelect2Items” method inside the Master model or Task model if you did not create a Master model …

The code above can be explained as follows …

  1. Line 3 – return the array of Select2 data using the “array_map” function
  2. Line 4 – store the related entity models name into a variable, in this case that would be the Country models name. This uses the Country relationship that was created in “Part 2” of this article series
  3. Line 5 – store the IDs of the related relationship entity model in the return data, in this case that would be the IDs of the Country model records
  4. Line 6 – find all the records for the model / model property in the “select2_data” table, in this case that would be the Task model and “countries” property

The next step is use the “loadSelect2Items” in the Task model to the load the Select2 data into the “countries” property, place the following inside the “afterFind” method of the Task model …

So that concludes the Select2 library solution for Yii2. I have covered the creation of the necessary database table and the read / write methods for reading / writing the data.

After the initial methods have been setup this solution will provide you with a way of easily putting a Select2 field on your forms that allows for many to many relationships between models with just a couple of line of code.

Select2 library solution in Yii2 part 3 – saving the data

To continue from the previous article …

http://www.jamesbarnsley.com/site/2016/10/31/select2-library-solution-in-yii2-part-2-database/

Once the database table has been created the code can now be written to display the Select2 field on the form and save the Select2 data to the database table.

In this article I will demonstrate the Select2 functionality as though we are wanting to add “Tags” to a Task model. When I say “Tags” I mean the standard web term for Tags. Essentially these are words that you can tag to an entity for example a WordPress article that categorizes the WordPress article using the tags allowing a user to search by those words.

When I say Task model, this is a fictional model in a Yii2 application that will allow the user to create and update tasks. For the purposes of this article it is assumed you will create your own Task model along with the controller and views. Create a standard CRUD for tasks possibly giving each task a name and a description.

You will need to create a Tag database table to store the Tag data along with its associated model. Create a database table with “id” field for the primary key and a “name” field to store the Tag name. Create a standard Yii2 model for the Tag table, this model does not need any methods inside it, it is a blank Yii2 model that extends ActiveRecord.

After you have created your task CRUD functionality and the Tag database table with associated model the Select2 functionality can be integrated.

First the field is added to the form using the Kartik Select2 plugin. The plugin can be found here …

http://demos.krajee.com/widget-details/select2

Add the field to the form using code similar to this. Include the plugin in the form …

Add the field to the form …

Create a “tags” property in the Task model, this will be used to store the tags field data on both saving and retrieving …

Now the field is added to the form and you have a property in which to store the array of data which the Select2 library needs in order to function. Next you need to use the “saveSelect2Items” items method as shown below to save the array data in the “tags” property to the database.

The “saveSelect2Items” method can be placed inside the Task model but it would be better in some kind of global area such as a Master model as is it likely that you will want to use the functionality in more than one model / form. I wrote an article on how to create Master models which can be read here …

http://www.jamesbarnsley.com/site/2016/03/14/create-a-master-model-and-controller-in-yii2/

The “saveSelect2Items” method is as follows …

The code above can be explained as follows …

  1. Line 3 – get the class name of the model object in this case that would be the Task model and convert it to lowercase characters
  2. Line 4 – get the class name of the store model object in this case that would be the Tag model and convert it to lowercase characters
  3. Line 5 – get the Select2 array data of the model object in this case that would be the “tags” property in the Task model
  4. Line 7 – if the model object Select2 property is not empty, in this case that would be the “tag” property
  5. Line 9 – get the current stored records in relation to the model and model properties we are using. In this case the Task model, Tag model and “tag” property
  6. Line 11 – loop through the currently stored records
  7. Line 13 – if the related model object ID is not in the model object property array data. In this case that is if the Tag ID is not in the “tag” property array data
  8. Line 15 – set the deleted flag to 1, which indicates deleted
  9. Line 16 – save the record
  10. Line 22 – loop through the array data in the model object property, in this case that is the Task model “tags” property
  11. Line 24 – check to see whether a record already exists in relation to the model and model properties we are using. In this case the Task model, Tag model and “tag” property
  12. Line 26 – if no existing record can be found
  13. Line 28 to 33 – create a new Select2 record and set the properties
  14. Line 35 and 36 – save the new Select2 record but if it does not save then return false
  15. Line 42 – the else part of the original if statement, if there is no array data in the “tags” property
  16. Line 44 – delete all the existing records for the model we are dealing with. In this case that is the Task model

As mentioned in the database article the “saveSelect2Items” method soft deletes the unwanted Select2 records with a little adaptation this could be altered to hard delete the records.

Now that the “saveSelect2Items” has been created you can call it in your Task model by placing the following code in the “beforeSave” method of the Task model …

The first parameter of the “saveSelect2Items” is the property used to store the Select2 array data, the second parameter is the original model that uses the Select2 field on the form in this case that is the Task model. The third parameter is the relation model in this case that is the Tag model.

The code up to this point puts a Select2 field on a form and saves the Select2 data when the form is saved. If you go back to the form the Select2 field will not be populated with the saved data yet as that is covered in the next article which talks about retrieving the Select2 data.

Select2 library solution in Yii2 part 2 – database

To continue from the previous article …

http://www.jamesbarnsley.com/site/2016/10/24/select2-library-solution-in-yii2-part-1-introduction/

I will now talk about the database table needed to get my implementation of the Select2 library working. As mentioned earlier the original design for the database included a table for each set of Select2 relations. So if I wanted a Person to be able to select multiple Countries I would have a Select2 PersonCountries table, 1 table per relation.

The latest design for the database has just 1 table to store all of the Select2 relations used throughout the web software application. I find this easier as I can then use the Select2 like a module, whenever I want Select2 in my web software application I just drop in the code files along with the database table.

The database table I am using is as follows …

I will now run through what the columns in the database table are used for …

  1. id – unique integer for the record
  2. entityModel – the short name of the model class stored in lowercase characters, for example the “Person” model
  3. entityModelField – the name of the model property used on the form to select the related Select2 relations, for example “countries”
  4. entityModelID – the ID of the model, for example the ID of the “Person” model
  5. relationEntityModel – the short name of the related model class in lowercase characters, for example the “Country” model
  6. relationEntityModelID – the ID of the related model, for example the ID of the “Country” model
  7. deleted – a flag to determine if this record is deleted
  8. createdBy – the ID of the user this record was created by
  9. createdDate – the date this record was created
  10. updatedBy – the ID of the user who last updated this record
  11. updatedDate – the date this record was last updated

Please note that “id” is just a standard primary key and is not unique to this article also deleted, createdBy, createdDate, updatedBy and updatedDate are not unique to this article. These are just standard columns that I populate all of my tables with and are not really necessary for the purposes of this article.

The deleted column may be necessary if you are running the code exactly as explained in this article but the record could have just as easily have been hard deleted and hence the deleted column is just personal preference.

To know more about the standard columns I use and to auto populate these columns read the following article …

http://www.jamesbarnsley.com/site/2016/04/04/populating-standard-columns-in-a-database-table-using-yii-2/

The above database table is the table I use to power the Select2 library relations in my web software applications. An example use case for this can be described as follows …

You have a update Person form (entityModel) with a countries field (entityModelField) that allows the user to select various Countries that are related to the person (the ID of the Person is the entityModelID). You can select various Countries and save them to the Person. For each country saved a select2_library record will be created, the ID of the Country is the relationEntityModelID and the Country model itself is the relationEntityModel.

At this point a Select2Library model will need to be created for the “select2_library” table. In the example used in this article a relationship will need to be created between the Select2Library model and the Country model. This will need to be created using the “relationEntityModelID” like this …

All of the above will become clearer when actually running the code and seeing the results. The code to get this to run will be described in the follow up articles.

Select2 library solution in Yii2 part 1 – introduction

For those of you who do not know the Select2 library is a Javascript / JQuery replacement for select boxes. Although there are a few options to choose from in terms of using the Select2 field the configuration I will be looking at will be the multi select configuration.

The multi select configuration is useful for allowing the user to select things that require multiple choices, a typical example of this could be Tags but at a deeper level the multi select configuration is useful for allowing the user to create many to many relationships between models on forms.

An example Select2 field is shown below, allowing the selection of countries on a form …

Select2 Library

The above Select2 field could be on a add / edit person form allowing the many to many relation between People and Countries.

The solution I am providing in this article is all about saving and retrieving the Select2 data in a way that will streamline the process so a Select2 field can be attached to any of your forms within your web software application and it will just work out of the box.

The front-end part of the Select2 field is solved already as you can use the following Yii2 plugin for that …

http://demos.krajee.com/widget-details/select2

The above plugin displays the Select2 field on your Yii2 web forms. The above plugin passes the Select2 field data in the POST as an array. It is what to do with that data in a consistent and streamlined way that this article I am writing covers.

There are many ways the data could be handled for example the data could be JSON encoded and stored in a column in the database table then JSON decoded and displayed on the form when retrieving. Another way would be to have relationship tables for each relationship between models and store the data that way.

The way I have chosen is more like the later except that I do not have relationship tables for each relationship, I simply have 1 central Select2 relationship table that handles all Select2 relationships across the whole web software application.

What is the purpose of all this?

Most programmers would just use the Krajee Select2 plugin (link above) and leave it at that in terms of abstraction. The programmer would manually write the save / retrieve code specific to each instance of the Select2 plugin most likely in the Controller. The way I am using the Select2 plugin is to have methods that handle all of this.

If I want to use the Select2 plugin field in any of my forms, with just a few method calls the Select2 plugin field will be up and running, saving / retrieving data for any field / model. The way I am doing this also integrates better with Yii2 and makes use of the Yii2 relations to fetch associated Select2 data, so this way integrates deeper with Yii2.

Allowing the user to select items on a form and have the software application save those items as a many to many relationship is not always an easy task. This method takes away some of the complexity of that, so that I can have user defined many to many relationships between models / database tables.

Yii 2 is here!

For those of you who do not know Yii is a programming framework built using PHP. For a number of years now I have been using Yii to built its software products.

Yii made programming software a whole lot more efficiently and easier as any framework is designed to do. I got in on the Yii framework in the early days before it became as popular as is it today.

So we have been waiting a number of months for the official Yii 2 release and it has finally been released, it was in an alpha stage until now and was not recommended to be used with building commercial products.

Yii 2 is not backwards compatible with Yii or rather Yii 1 as it can now be named. So any software products will have to be built from the ground up if any programmer had an old project written in Yii 2 but now wants to use Yii 2.

This is the first time a Yii version has been released that was not backwards compatible with its predecessor.

I think this is because the founders of Yii wanted to improve on Yii to such an extent that the fundamental core would have been altered in itself and could not be done by just building on top of what was already there like they did with previous versions.

www.yiiframework.com

This says something about the new Yii 2 in that it is fresh, tailored to its purpose and must be so improved that an entire rewrite was necessary. Rather than just layering on top of the old Yii it had a complete re-write which enabled its developers room to enhance and integrate some real fundamental improvements.

I will start using Yii 2 around January next year when I have finished all my current Yii software projects. I aim to write a new software product to test my skills in Yii 2. I will keep you updated on my thoughts about Yii 2 as I make the progression.

Font Awesome is awesome

Font Awesome is an iconic font library that provides a lot of professional icons you can use in a web based software application free of charge …

http://fortawesome.github.com/Font-Awesome/

Icons are implemented as fonts so using any of the icons in your web software application is as simple as including the font awesome CSS stylesheet and adding a class to your HTML element.

Bootstrap

I have recently been working on client work requiring the use of Bootstrap …

http://twitter.github.com/bootstrap/

Bootstrap is a front-end framework for creating user interfaces, it is developed and maintained by Twitter. Bootstrap also has Yii extension component so it easily integrates with my number one framework back-end choice which is the Yii framework.

http://www.cniska.net/yii-bootstrap/

Before I learned about the Bootstrap framework I was coding the front-end of the frameworks using standard HTML5, CSS3 and JQuery. Now that I have learned about the Bootstrap framework, Bootstrap can do a lot of the work for me that originally I was having to code myself. Bootstrap provides a beautiful set of components such as buttons, menus, grids which essentially I was having to write from scratch before I knew about Bootstrap.

Bootstrap components are also consistent with what many people have come to expect with the web user interfaces that the world is seeing today, clean, streamlined and beautiful.