Post 3: Digital Design, Database, and Web Programming

Last week we had to submit our assignments for the Digital Design course, the requirements were to convert two pages from a Photoshop mockups to HTML files. Because of this course is my favorite one in this semester, I liked to challenge myself by converting three pages not only two in a record time. The time I spent in designing those three pages using Photoshop and the nice result that I got pushed me to use them all in creating the HTML files and to have more samples in my portfolio. Actually, the task was not as easy as I thought; I tried to use many Photoshop enhanced features to add a professional look to my design, and that made me spending more time than I expected in order to keep the same look and feel in the HTML pages as in Photoshop mock-up. Being detailed oriented in using the same pixel distance and the gradients exactly, is important for the front-end developing and that took me a while, but I was able to finish my project the end.

For the Database course, starting MySQL DBMS (Database Management System) was a kind of relief to me after spending the previous two weeks using more advanced topic in PL/SQL (Procedural Language/SQL), for more details visit: Oracle (PL/SQL). It was not easy to me understanding the full topics of using procedures and function with the PL/SQL depending on the lab exercise or the PowerPoint slides only; I had to go through the chapters that talk about these advanced programming subjects in our textbook. Certainly, the more exercise I do with procedures and functions the better knowledge I will have. Although, we are going to use MS-SQL server with ASP.NET and MySQL with PHP for the back-end development, learning Oracle Database plus PL/SQL database programming languages was helpful to me to understand the real structure of the database tables using one of the major DBMS, Oracle, in the world.

In web programming course, we wrote a simple web form to demonstrate the work of AJAX (Asynchronous JavaScript and XML) using regular JavaScript and jQuery was so important. Reloading the entire HTML page just for a piece of information that has to be fetched from the server is time-consuming, especially if the page has many multimedia files. Using XMLHttpRequest Object was a great solution for this problem, for more details visit: Ajax/jQuery. In the class, we tried to send the form information to a local server using XAMPP, a free and open-source web server, to imply the functionality of AJAX, you can read more about XAMPP.

Post 2: Back-End Technology, HTML5 Form

In the last class of Project Management, we reviewed the four necessary parts in developing a website, but we mainly focused on the strategy and the requirements of building a Contentment Management System (CMS), the four parts are:

  • Front End (Interface)
  • Back End (Server-Side Language with DataBase)
  • Content
  • Strategy

In my team, my role is in dealing with the back end section regarding redesign and build the hospital website, and this gave me the responsibility to explain all the details about this part of the site development. As web developers, we know that there are many server-side programming languages, but the most commonly used are PHP and ASP.NET with C#. That’s why these two languages are being taught in Post Graduate Web Development Program at Humber College. Although I have a tendency to build the back-end of the hospital website using PHP and MySQL in the next semester, I have to explain my part in back end using ASP.NET. The reason why I prefer PHP is because it’s an open source technology, used in WordPress and Drupal CMSs, and supported by most web hosting companies. I am listening here two links that might be useful:

Since we covered ASP.NET in details in the first semester my job is to estimate the time we need to build the website using this technology in order to estimate the budget for the back end. Fortunately, we have a final ASP.NET project which to build a database driven website that let the admin users log in to change or edit the database and public web pages to let any user view or retrieve these information from the database. This project demonstrates the idea of using CMS, so upon finishing this project I will have a better idea about the time I need to spend in order to build a similar website plus a clear understanding about what kind of difficulties or struggles I might face in building a website using ASP.NET.

To add my last opinion, learning ASP.NET beside PHP is important for someone who is looking for a job mainly as back-end developer. There is no doubt that a candidate will have better opportunities in finding a job in this competitive field because there are many web developers that use PHP but there are few who use ASP.NET, for more details visit “Web Technology Survey”.

In web programming class, we worked on HTML5 Form and we discussed most of its advanced features. The new attributes that have been added to HTML5 form and the form validation enhanced the accessibility of using the form in different devices. The drawbacks of using these new features they are not fully supported by all browsers, for more details, you visit “Can I use”.

Anyhow, these restrictions will not stop me from using these new tags or attributes to prepare myself for the coming up to date technology, for more details visit “HTML5 Form Attributes (W3 School)”. To be on the safe side, JavaScript and Server-Side form validation are both needed to overcome the problem with old browsers that don’t support HTML5 form validation, and the other important reason is that JavaScript could be disabled in the user browser which leads to some security issues and that’s why server-side validation is also required.

Post 1: Timesheet and Some HTML5 Tags

Hi everyone,

Based on the requirements for the web development program, we have to add a new post on weekly basis and using WordPress to manage this blog, and this is my first post. In my project management midterm exam, I chose to talk about the timesheet and I would like to share with you some of my ideas about this subject and why I wanted to write about it.

In my project management midterm exam, I chose to talk about the timesheet and I would like to share with you some of my ideas about this subject and why I wanted to write about it.

In web development field we charge our clients based on the time we spend in building their websites, so time is one of the most critical tasks in project management because it will determine the project budget. In dealing with a client, the second question after the price will be about the time needed to build their website, or in a job interview, for example, the employer might ask the candidate about a task or procedure if he/she can do it or not, then the next question will be how long it takes to finish it.

Time is important to analyze our skills and point our strengths and weaknesses. For example, if I need to compare myself with other developers, time will be one of the important factors to be considered beside the skills that I have. So even if I can build this web page with the same nice design and content like other developers, but the question is: How long it takes me to finish it? Is it a reasonable time? All these questions can’t be answered without putting a strong plan of creating a timesheet whenever we work on a project. The more details I have in my timesheet, the more logic I will have in deciding or giving a precise estimation about the time I need to finish any task in the future.

In web programming course we talked about using the new HTML5 tags like audio, video, Canvas and SVG last week. For a web designer who has been using Flash for more than 5 years, it was not easy to me to adapt the idea of ignoring Flash and moving toward using Canvas and SVG in HTML5 and jQuery instead. Flash offers professional tools for an artist to draw any shape plus adding animation to any object inside the flash page or scene. Due to the plugin that the users need to install in their browsers and because Flash is not supported by apple products like iPad and other mobile devices, these are some of the reasons why Flash became an obsolete tool in web design/development fields.

Using Canvas and SVG was not that bad to me. Although I had to go back and forth between my code and the browser window to place my shapes exactly at the right locations, it was a nice experience. Using these two new tags made me go back many years ago in my memory and reminded me in my second year at the university when I was a computer science student. At that time we had to use a programming language called PASCAL, a  procedural programming language, designed in 1968–1969 and published in 1970 by Niklaus Wirth, to draw shapes almost the same way by giving the values of x and y coordinators for example, for more details visit: Wikipedia (Pascal – Programming Language).

As a compensation for losing flash, I started to move forward toward using Adobe Edge Animate, a tool for web designers/developers for creating motion and interactive projects using HTML5, CSS3, and JavaScript (The expressive web), for more details you can visit: adobe (Edge).