Web Development - A Practical Guide To A Web Developer

Web development is the term that we apply to develop a website. Either a single static page or the most complex website must undergo web development.

1-May2018

Web Development - A Practical Guide To A Web Developer

Web development is the term that we apply to develop a website. Either a single static page or the most complex website must undergo web development. There are 3 kinds of web development specializations namely Front-end, Back-end and Full-stack web developers. Front-end development is client side development and Back-end development is server side development. Full-stack developer is the one who is familiar with front-end and back-end technologies.

Practical Guide to be a Web Developer

Since Web Development and its technologies and Methodologies are very vast and can’t be explained all in one blog post, so let’s have a glimpse about the technologies and methodologies used in web development.

Ist Phase:-
Required Tools & softwares:-

Text Editor - Visual Studio Code, Atom, Sublime Text

Image Editing - Photoshop, GIMP, etc.

Good Browser - Google Chrome, Mozilla Firefox

Deployment Tools - FTP Client, SSH Tool

Cloud Storage (optional) - Google Drive, Dropbox etc.

Technologies:-

HTML/CSS - As these are the building blocks of the web, and every website uses both, so these are the basic things to be learned before anything else. In fact they are easy and quick to learn. Learning of core fundamentals and basics of Flex/Grid are very important to divide as sections and o bring forth responsive layouts.

Basic Vanilla Javascript:-

Basic JS (No Frameworks)

Data types, Functions, Conditionals, Loops, Operators etc.

Ajax / Fetch API / JSON

ES2015+ (Arrow functions, Promises, Templates strings)

Deploying a Basic Website:-

Shared Hosting (InMotion, Hostgator, Godaddy etc)

Learn the Basics of CPanel (creating email accounts, File Transfer Protocol)

Upload a site with FTP (Filezilla)

Register a domain name and learn about DNS / Name servers

Web Designer / Basic Front End Developer

Build simple websites and User Interface

PSD / AI -> HTML/ CSS

Some Dynamic User Interface with Javascript

These are the basic things, through this above mentioned guide you can choose to be as a freelancer or you can try a entry level position.

IInd Phase:-
Full Stack:-

HTML / CSS Frameworks - Bootstrap, Materialize etc.

Front End JavaScript framework - React, Angular etc.

Server Side Language / Technology - Node.js, Python etc.

Database - MongoDB, MySQL etc.

HTML/CSS Frameworks [Choose one Framework]:-

Twitter Bootstrap 4 - General and most popular framework

Materialize CSS - Primarily a UI/UX Framework

Bulma - Easy to learn, no need of Javascript

Zurb Foundation - Alternative to Bootstrap

Skeleton - Very light boilerplate

Front End Javascript Framework [Choose one Framework]:-

React - Popular for startups, uses stake manager called Redux, JSX

Angular - Popular in enterprise, full featured, NgRx

Vue.Js - Fast, light, easy to use, stake manager called Vuex

Aurelia - Light, feels like Vanilla Javascript

Site Technologies to be learned:-

GITHub - Version control, Backups, Collaboration etc.

Basic Command line - Folder Navigation and File Creation etc.

APIS / REST - Learn how REST API works

HTTP / SSL - Securities

CSS Preprocessor - Sass

Webpack & Babel - Module loader & JS compiler

Server side Technology [Choose one from below]:-

Node.Js - Fast, scalable and powerful

Python - Popular, rapid development, great integration

PHP - Practical, easy to deploy - Wordpress & Laravel

Ruby - Rapid development and strong community

C# & ASP.NET - Very powerful, Microsoft

Database [Choose one Database]:-

MongoDB - NoSql, non-relational, suggested for Node.js

MySQL - Popular relational Database

PostgreSQL - Powerful but a bit more difficult than MySQL

SQL Server - Microsoft’s implementation of SQL

Oracle - Heavily used in enterprise

Firebase - Cloud database maintained by Google

Server side Frameworks [Choose one]:-

Javascript - Express, Hapi.js, Adonis, Loopback, Swagger

Python - Django, Flask, Web2py, Pylons

PHP - Laravel, Symfony, CodeIgniter, Yii2

Ruby - Ruby on Rails, Sinatra, Nitro

C# - .Net

Content Management Systems [CMS]:-

Wordpress

Drupal

Joomla(Php)

Develops & Deploying Applications:-

Dedicated Server / VPS

Cloud Hosting - Digital Ocean, Heroku, Amazon Web services

Cloud Storage - Amazon S3

Working with SSH & command line

Server maintenance & Software updates

The Most Popular web Development or Software Development Methodologies are as follows:-

Waterfall Model

Prototype Methodology

Agile Software development Methodology

Rapid Application Development

Dynamic System Development Model Methodology

Spiral Model

Extreme Programming Methodology

Feature Driven Development

Joint Application Development Methodology

Lean Development Methodology

Rational Unified process Methodology

Scrum Development Methodology

Each development methodology has its own pros and cons, so basing upon our requirement we need to opt the methodology.

Conclusion :

Websites has become means of sharing information and interactions. For developing any web page or website many softwares and updated technologies are available in the market. We have mentioned some of the basic tools above, that can help both beginners and professionals in the area of web development, to create absolute and diversified applications with the aid of selected tools.

Article by:

Chakravarthy Jah