Should you reveal your budget?

Should you reveal your budget to a potential web development company / web development freelancer? I am presuming most web development companies and freelancers would say yes.

In my business I work on a day rate so to me it does not really matter whether the budget is revealed or not. If you spend £12,000 you will get a £12,000 web software product, if you spend £36,000 you will get a £36,000 web software product. It does not matter to me exactly what the total budget is, you pay me by the day, when you stop paying the work stops.

Having said that knowing the budget can be important. If you have an idea of what it is you want to create it is important to make sure the budget is really there. There is no point in expecting a £36,000 web software product for £12,000.

I generally try to make sure that the “must have” requirements can be fufilled within the expected budget. After the “must haves” have been taken care of the remaining budget can be used to provide extra “goodies” that would otherwise not be there. Design improvements, extra features, additional reports, sidebar information giving the product the extra polish it would otherwise not have.

An ideal scenario might go like this …

  1. You have an idea of the features you want in the web software product.
  2. We have discussion on those features to make sure anything has not been missed.
  3. I take a look at the budget and decide whether I think I can get the work done within budget.
  4. I break the first couple of features down into tasks and add them to the project management system.
  5. I complete the first couple of features, we have a review and see whether we are on track and budget.
  6. More features are added to the project management system until all features are complete.
  7. At this point we discover that one third of the budget still remains.
  8. The additional budget is used to provide extra goodies.

Please note that the way this article is written can give a wrong impression almost edging to a fixed fee kind of feel. I always work on a day rate and any agreements about what can be done in the time allocated are estimates only.

Generally a £36,000 budget will be broken up over the course of months or a year and will act like a retaineer agreement. Generally in such an agreement the overall budget is never discussed, the contractor is paid for a number of days per month to complete work. This is how I work. However that does not mean that an overall “background” budget does not exist.

So, should you reveal your budget to a potential web development company / web development freelancer? Well in my business the answer would be yes, if you want my “opinion” / “estimate” on whether the proposed feature set will fit within the budget.

As we work with each other you will get a feel of what can be accomplished, at what cost and in what timeframe.

Tips for freelancers

Here are my tips for new or existing freelancers. Looking around the web there are many articles that discuss this theme and they all seem rather identical to each other.

I personally get bored of reading these after a while but I can promise you that even though some of the ideas discussed in this article may be similar to other articles, they are all my personal tips. Each one of these tips is important even if they may seem generic …

Shared office space

Certain situations may happen whilst freelancing when you need the advice of other freelancers. Preferably this would be face to face advice. When working in a shared environment with other freelancers this gives you the opportunity to get the needed advice right at the time you need it.

You may think that having your own private office is better as it avoids interactions with others but this can be a lonely road and getting advice on internet forums or through Skype just does not have the same effect.

Also being around other freelancers can provide a motivational boost to your energy levels as well as providing opportunities you may have missed whilst working in a private office.

Sell yourself as an individual

If you are freelancer then sell yourself as a freelancer. At a certain point in time a client is going to know that you are individual and not a group of people anyway.

A client will wonder where the rest of the company is, at that point you will have to explain that the company consists of just yourself. Save yourself the hassle and just sell yourself as a freelancer.

Payment schedule

Agree to a payment schedule with your clients and stick to it. Preferably agree a payment schedule where you are always paid in advance so you are never having to do work that you have not already been paid for.

Hourly rates

Charge hourly rates for your work. Quoting for fixed price is always a headache.

Even if you think you have everything covered in your fixed price contract the requirements of the contract can be too subjective and no matter how detailed it appears some of the requirements will always be left open to interpretation i.e. client wants a new kitchen, you build him the kitchen, client actually wants a kitchen with gold work surfaces.

Yes you can argue that you have provided the kitchen thus fulfilling the requirement however the client will also argue that the gold work surfaces came under the “new kitchen” requirement.

Arguments can then happen, clients may threaten legal action, you are a 1 person freelancer against the larger client company. You can take this risk if you want to or you could just save yourself the hassle and charge hourly.

Sustainable hourly rates

You may find that you will not always have a full schedule of work as a freelancer. There are gaps in the work flow and other expenses that need to be accounted for.

Clients will always know someone who can do it cheaper but the bottom line is it does not matter what Bill or Joe next door charges for their freelancing services. Your hourly rates need to be sustainable.

If you do not have sustainable hourly rates then you will not have a business for very long. This business has got to support you if it does not then it will not last.

There is no point in charging cheaper rates to get work if those rates are not going to sustain your business.

Contracts

Adopting the “hourly rate” idea earlier your contract should be reasonably straightforward, an hour of work done, an hour of work paid.

Charging by the hour takes some of work out of the contracts as you not agreeing to a requirements specification on a feature by feature basis.

Always have a contract though nevertheless, contracts provide help when dealing with client disputes.

Client profiling

Do not just accept any client that wants you to do work for them.

Profile the client …

  1. What are the clients good and bad points?
  2. Does the client value your work or see you as a commodity?
  3. Is the client someone you really want to work with?
  4. Is the client criminally minded?

Come up with a profile of the clients you want to work with and only or at least mostly only work with those types of clients.

Process

Have a clearly defined process for dealing with clients from on-boarding, design, development, testing, delivery and on-going work.

Every freelancer will have a process of some sort but it is important to get the process defined and written down.

The process is good material to present to clients thus helping with marketing activities. The process is important to you as it improves reliability.

Consider these tips if you are a freelancer or are new to freelancing.

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.

Yii loadModel method?

So it was not long into my Yii development days that I began to notice this awful method that seemed to crop up more and more in other Yii developers code bases.

This is the so called “loadModel” method and it looks something like this …

The idea behind this method is that it is called from other methods in the same controller as itself to return a loaded model for use in the method. I do not understand the point of this method and I never have. I have never used it in any of my Yii 1 or Yii 2 code even though a lot of developers did.

Why is a method needed for loading models?

Please note that this method is only for loading existing models and not creating new ones so the intent behind the method could not have been “It is an easy location to change the model name if I need to so as I do not have to change it in multiple places if ever I need to change it”.

If this had of been the intent then the method would have been written like this …

As I will still need to declare the model separately when creating new models in the controller as the original method did not handle the creation of a new model.

Also a lot of the developers using the “loadModel” method are using different models in their controller anyway which are different from the model loaded in the “loadModel” method, so again the benefits of having the “loadModel” method seem non-existent.

Another so called benefit which could be tried to passed off as genuine is the use of the exception. If the model is not loaded then throw an exception saying the page does not exist.

The test to see whether a user can access the page and the test to see if the record for the model exists based on its ID is normally and best handled in the user permissions / RBAC so it is not needed in the controller.

My conclusion to this is that there is no benefit to using the “loadModel” method and it is more of a gimmick which developers have copied from other developers without thinking about it.

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.

KnockoutJS

I have been using KnockoutJS on the latest work I am doing for a client of mine. The work involves creating front end layouts for their 2D / 3D product viewer and personalization product.

KnockoutJS has something called Observables, these are variables that can automatically update the user interface without have to use event handlers and also without having to bind to element IDs. You bind the Obserables to HTML elements using a data-bind attribute, within this data-bind attribute you can specify various bindings i.e. visible, click, css, style, text, attr plus more.

Using these bindings you can bind them to your Observable variables, so you can say if observable is true make an element visible. The element will automatically switch between visible and invisible based on whether the Observable variable is true or not.

KnockoutJS also allows you to use Observables as arrays, so take this scenario. You have an array which contains your products, using the Observable array and bindings you can automatically update the product list purely based on the data in the array. The data in the product list is displayed using the KnockoutJS foreach loop control flow feature.

KnockoutJS also provides more structure to the JS in the form of view models. Essentially view models represent the data used in the view within the application.

These are some of the benefits of using KnockoutJS.

Web programming language to learn first

The other day a friend asked if his nephew could borrow one of my programming books as he wants to start learning programming. I was asked which I would recommend for a beginner and this got me thinking. Which programming language did I learn first? What would be good for a beginner?

Well apart from a brief go at C# whilst at University the first programming language I learned was HTML. Yes I know it is a mark up language and not really a programming language but for the purpose of this article we will class it as one.

So here are my recommendations at the time of writing this article. I would recommend learning HTML5 first and at the same time CSS3. The reason for this is that in my opinion they are easier to learn than a programming language and as a beginner the would be programmer is going to want to keep momentum up and learning something too difficult will bring discouragement.

Learning these two languages are basically a prerequisite to the other languages because even if you where to program a web application part of that will involve creating a user interface and that is generally done in HTML5 and CSS3.

When programming in HTML5 and CSS3 the beginner programmer can see practical results in very little time, neat and cool user interfaces can be created bit by bit without any real complexity and to see these bit by bit changes to the program all the programmer has to do is refresh the web browser.

Also HTML5 and CSS3 only require a web browser and a text editor to get started with. Programming languages generally require installing and configuring applications to get them working.

After learning HTML5 and CSS3 the programmer can move onto something more challenging and what many would consider a real programming language. The next step I recommend is learning Javascript, this is not Java, Javascript and Java are two different languages so do not get them confused.

Learning Javascript will require a whole new paradigm as to what was previously learned in the HTML5 and CSS3. Start with learning the basics, variables, conditions, loops then move onto the more advanced topics like functions and classes. Like HTML5 and CSS3, Javascript only requires the use of a modern day web browser to work and you can get pretty much up and running straight away.

After learning Javascript I would move onto learning PHP and MySQL. This will require you setting up a web server and installing PHP. Certain programs like WAMP / MAMP / LAMP can help with this and give you everything you need to get up and running.

Use the skills you have learned in Javascript and bring them over to PHP. In terms of the paradigm they are similar except PHP is a server side language and Javascript is a client side language. If you can get your head around that everything will be fine, I would not say the jump from Javascript to PHP will be as difficult as the previous jump from HTML5 and CSS3 to Javascript.

You will need to learn MySQL to talk to the database and pull data into your PHP web application. After you have learned these 5 languages the sky is the limit. You will be able to produce full blown web applications.

After learning these five languages I would also recommend learning a PHP framework and a Javascript framework as they will make your programming even easier. For quite some time I coded in standard PHP and Javascript because I did not trust moving to a framework but I can definitely it was one of the best programming decisions I ever made.

You will produce better quality web applications in less time. Also whilst the learning the Javascript framework you will most likely run into Ajax, which is another good concept to learn.

Well that is my recommendations for anyone starting out in the web programming world, give it a go.