03 May 2021
We use the web every day for shopping, social media, watching videos, playing games, and many other necessities. Everything that we do now is mostly on the web and our daily usage reports on our phone are trying to tell us that we spend almost 18 hours a day online (my daily usage hour).
Well, what can I do? Even the book I read is downloaded from the web.
So, what is the web? Is it the strings that spiders make on the corner of our ceilings that I am referring to? No, we all know that answer, it is the digital web that grabs all our attention nowadays.
The web consists of our favourite websites such as Netflix and Spotify. These are made up of many advanced and classic technologies that include HTML, CSS, PHP, URL, DNS etc.
Like the human body, the web also contains an external and internal section. What we see on displays is the Front-End part of it and what is happening inside and out of our vision is the back-end part of the web.
With the growth of the usefulness of websites, the interest in learning web development and careers in this field is also on the rise.
Overview of Web Development in Bangladesh
Since 2010, Bangladesh's ICT sector has expanded at a rate of 40% per year (Source: UNCTAD). The emergence of a large number of young entrepreneurs and their passion and the government's strong focus on ‘Digital Bangladesh' are the key driving forces in Bangladesh's ICT industry.
In order to participate in the evolution of Digital Bangladesh, many companies started creating their online presence to reach out to more audience as Bangladeshis are getting more and more dependent on technology.
Therefore, there has been a rise in the number of web development companies in the country to meet the requirements of the growing popularity of startups and businesses wanting to go online.
Enthusiasts are learning web development and working as a freelancer, getting employed in web development companies or even starting their very own company providing web development services.
In regards to that, this blog aims to educate whoever is interested in learning the fundamentals of web development and for those who already have an idea. This is to refresh their knowledge with some modern terminologies and technologies that are now popular in the web development sector.
The web is the foundation of Web Development.
The World Wide Web, web, in short, is the method of transmitting data over the Internet that makes use of the HTTP protocol and HTML.
Source: MDN Web Docs
We can consider a URL to be similar to a regular postal mail address:
Scheme represents the postal service you want to use
Domain name is the city or town
Port is similar to the zip code
Path represents the building where the mail should be delivered;
Parameters represent additional information such as the apartment number in the building
Anchor represents the act
The scheme is the first part of the URL and identifies the protocol used. Protocols are set methods used to transfer data within a computer network.
In most cases, HTTP or HTTPS is used in which the latter is the secured version. HTTPS is typically used for e-commerce and other sites with secure transactions.
The web can be described as a set of interactions between two kinds of systems: clients and servers
Clients are the instruments that make web content requests and extract them. Browsers, smartphone apps and screen readers are all common examples of clients.
In reality, one of the most difficult aspects of web design and development is keeping up with all of the new clients (the number of which is growing exponentially) and how they navigate and render the content. Hence came the necessity to design responsive websites to make them compatible with all device screens.;
Servers are programs that provide web content or services to clients.
It is important to understand the various types of servers and how they function to learn web development and web hosting.
Every time you type “netflix.com” on your browser’s URL (Uniform Resource Locator) box, a request is made to a server (DNS).
“netflix.com” is the domain name for Netflix (like your name) and it has a unique IP address (like your mobile phone number).
Through the URL, a request is made to that server by your browser to show you the content that you want (in this case Netflix’s landing page).
These are all happening Infront of you.
Behind the scene, (while you see that annoying loading indicator), this request is usually directed to a domain name server, or DNS, which is simply like a phonebook consisting of all the contact numbers (IP addresses). The URL is then converted into an IP address by the DNS which the browser uses to locate the host's server (Netflix) and submit a request for the content (Netflix’s home page).
Static sites are simple sites that need no further processing other than sending the content requested by the client.
Dynamic sites require additional processing which is done by a web application such as PHP, Python or .NET before they send back the content to the browser.
For example, when you sign in to Netflix, you input your data and then click on the “Sign in” button. After that, you see the home page with your name and customized movie list according to your watch history and likes. Here the Netflix server processes your details and displays your customized content.
All of the above processes are executed within seconds.
That is why developers need to understand each stage of how the web works because if a stage is not carefully implemented, the site will either work slowly or not at all and may show the dreaded DNS error message which tells the audience that the site cannot be found at the location and they will need to try again.
Even for hosting the website you just developed, it is important that people can find your site through the DNS, especially when registering multiple domain names for one site. In this case, there are some web developing firms in Bangladesh who provides free hosting service for a limited time along with the development process to help growing businesses or start-ups as a heads up while they can focus on other aspects of their business.
Front-end Web development is also known as client-side scripting and involves developing the User Interface of websites and applications.
Some elements of front-end development include:
The main focus of the front-end web developers is to collaborate with the back-end developers and to create a functional and visually attractive website that will bring in a lot of readers or customers and hence fulfil the purpose of the site.
Front-End Web Development is often confused with web designing. Web designers create an actual design out of a plan or an idea, they have to ensure the best user experience and accessibility of the site. Whereas, the front-end web developers implement those designs with codes and adds functionality.
Web designing was not so prevalent in Bangladesh until recently. During the last five years, as more and more online companies are opening up, so came the need to stay ahead in the competition with good design and user experience.
Therefore, Web Development companies in Bangladesh provide individual services like Web Designing and Experience Design etc. and Web Developing service package as a whole which includes both the front-end and back-end development.
HTML stands for a Hypertext Markup Language, and it is the standard markup language for web pages.
Opening and closing tags are commonly used in HTML elements to surround and define content. Different elements, for example, may define a text as a heading, paragraph, or list object.
HTML5 maintains backwards compatibility with previous HTML versions while introducing new structural tags and API support, allowing elements to be modified, dragged and dropped, and facilitating communication from inside the HTML document without the need for external scripting. HTML5's adoption has been rapid, and it is now reasonable to consider it the latest HTML standard.
HTML has a plethora of tags. They're also used to define document elements and provide structure.
Learning HTML entails learning the language's syntax, which elements are permitted, and the fundamental structure of HTML documents. All of this is extremely simple to understand, and the tag collection is small enough to learn in a day or two.
If we compare HTML structure with that of a sandwich:
- In order to have an HTML text, you must have opening and closing HTML tags <HTML></HTML>.
A sandwich requires two slices of bread; without those, you have a salad rather than a sandwich.
- The head of the HTML document <head></head> appears immediately after the opening HTML tag and includes all of the non-visual elements that contribute to the page's functionality. Here you'll find elements like meta tags, which might include keywords or page descriptions to help define the document's content, as well as links to external tools, such as the CSS file.
The head is similar to the condiments, lettuce, or tomato, that you would place on a sandwich near the top.
- The body tag <body></body> comes after the head tag and contains all of the visual structural components. The body tag may include a variety of elements such as headings, paragraphs, lists, images and links. Simply put, if it is a visual feature, it must appear in the body tag in the order you want it to appear.
The body tag is like the sandwich's meat. It contains roast beef, cheese, and whatever else you want in your sandwich.
CSS, or Cascading Style Sheets, is a style sheet language used to govern how HTML documents are displayed.
As the name suggests, they are a set of formatting rules that are typically stored in an external file. They can control a wide variety of pages, from a single page to entire websites.
CSS styles are composed of two components: the selector and the declaration.
- The selector, for example, p for paragraph, tell the browser which element or elements to style. The style will adjust the formatting for all paragraphs around the web-based on this selector.
- The formatting instructions are provided in the declaration, which is enclosed in curly braces.
- One of the most significant advantages that CSS brings to web design is the ability to create highly scalable designs. You can modify one without affecting the other.
- Another advantage is the increased portability of your content. CSS can be written to adjust the layout and styles based on factors such as screen width and orientation and thus makes the design responsive.
It can do a variety of things for the website, such as creating interactive features, dynamic menus, opening new browser windows, and updating data directly in the browser.
Having the advantage of being executed in the browser, or on the client-side means, the page content does not need to be refreshed for the changes to take effect.
By now, you might think that why is there so much information in this blog and do I need to know all of these. The answer is, yes.
Yes, because now that web development is so prevalent, many Web Development companies in Bangladesh require the developer to be updated in modern technologies such as frameworks and libraries. In all of the job requirements that you will read or have been reading, you must have noticed that there are more to learn than the basics.
The reason, I am including these here, in short, is because now you know some keywords that you can research to learn more and you can always come back to this blog or even bookmark it for future reference.
With Front-End Libraries like Bootstrap, you will easily learn how to style your site. With Sass, you will learn to expand and add logic to your CSS types and finally, with React and Redux, you will learn to build powerful single-page applications.
A bit about those libraries in short:
Sass, which stands for "Syntactically Awesome Stylesheets," is a CSS language extension. It adds functionality that simple CSS does not have, making it easier to simplify and manage the style sheets for your projects.
APIs, or Application Programming Interfaces, are programs that are written to include a set of instructions and specifications for using a particular service. They are typically written to make it easier for developers to use an application or to make services accessible to anyone who wants to use them.
For example, suppose you are making a website for cooking. For cooking, you will need a database of recipes but you do not have the time or resources to build up a whole set of recipes. You can use an API that pulls data from a source providing a free/paid recipe dataset.
In this part, we'll shift our attention to knowing what happens on the server-side and the various techniques used to build dynamic websites.
Learning about server-side web development is highly recommended in today's modern world.
A range of programming languages and frameworks, such as PHP, .NET and python have provided developers with a broader range of resources to choose from while building dynamic sites.
PHP's compatibility with Apache servers and MySQL databases is what makes it so relevant in web development. Anyone can now develop a powerful web server capable of building and hosting scalable dynamic sites using open-source software.
In reality, PHP is used to build many complex web applications, such as WordPress. PHP code, like most server-side languages, is embedded within the HTML of a website. The file with .php extension will contain regular HTML but PHP integrated inside. The extension tells the browser that the PHP code needs to be processed first.
For a PHP file to run locally, it is important to have a server running on your computer.
Local servers such as XAMPP, WAMP, LAMP, and MAMP are commonly used when creating PHP websites. This software is primarily used to test the website on a local level. Developers will find errors and bugs before uploading by testing locally. The primary distinction between XAMPP, WAMP, LAMP, and MAMP is the operating system on the computer.
XAMPP is for X-OS, Apache, MySQL, PHP, and Perl.
WAMP is the Windows application.
LAMP is for Linux System.
MAMP is for Mac OS X application.
.NET is not a server-side program itself. Microsoft's whole application framework is referred to as .NET.
.NET, like Java, enables developers to create large-scale applications for both the web and the desktop. As a result, .NET is normally more complex than PHP. Therefore, it is not the first choice for web developers who focuses on developing dynamic sites only.
Sites created with the.NET framework must be hosted on a Windows server. As a result, hosting companies may be more constrained, and the price structure for such sites is usually a little higher.
Python is a prevailing open-source programming language designed as a multipurpose development tool. Although Python is not exclusively based on the web, it does provide several web-related libraries that make it very easy to create powerful websites and applications.
Even though Python's syntax is fairly basic and easy to understand. It is typically used to build larger dynamic sites and web-based applications rather than small dynamic sites.
It has the versatility to create nearly every form of a website, starting from content management systems to social networks. It is compatible with any client-side framework and can distribute content in a various format that includes HTML, JSON, XML, etc.
Django provides a safe way for managing user accounts and passwords by preventing common mistakes such as storing session information in cookies. Instead, it stores only a key in cookies and the actual data is stored in the database and stores a password hash as an alternative to direct passwords.
Other than that, Django also protects the site against other vulnerabilities such as SQL injection, cross-site scripting etc.
Compared to traditional PHP language, Node Js eliminates the waiting time in processing and is also memory efficient.
According to the Node-by-numbers study 2020, the project is bigger than ever, with 98.9 million downloads.
- improved developer performance and overall productivity
- reuse and exchange of code
- a large range of free tools
- swiftness in performance
- simple information sharing among a team
For most companies, there are three key matters to consider when selecting an application platform:
- Cost and hosting options
- easiness in use of the website
New companies or even established ones who want to develop a dynamic and responsive website for businesses can find a talented web developer locally or a web development firm in Bangladesh to do the job for them.
It is important to find a firm that can build a relationship with the clients, in that case, they can even help make the decisions regarding server technology that's right for the client, their budget and the project itself.
Most of all, it is important to learn as much as you can as a client about the various platforms so that when the time comes to make a choice, you're making an informed one.
They specialize in customizing a plan that suits the clients, and to unfold the right tech for the toughest business problems regardless of the market be it for web development, application design and development, business solution, or any maintenance related issues.
Databases are the most reliable way to store complex data or massive data sets, and they can make things much simpler for both web developers and clients.
There are two kinds of databases: SQL and NoSQL.
- A relational database is SQL, while a non-relational database is NoSQL.
- SQL is represented in tables while NoSQL is expressed in key-value pairs or JSON format.
- MySQL and PostgreSQL are the most common SQL databases, while MongoDB is the most popular NoSQL database.
The most common language for handling and extracting information from databases is SQL or structured query language. SQL is normally used in web applications to update, build, delete, or retrieve data from a database.
Data is organized into rows and columns, with columns representing the data and rows storing the actual data. Web applications can parse and use this data inside the framework using simple SQL queries. SQL has a basic logical syntax that most people can pick up quickly.
SQL queries can be refined to further filter data sets or even join similar tables together to create a larger data set, and common statements like select, insert, update, and delete make it very simple to retrieve or manipulate data.
To control data inside the framework, most web server applications use database management program like MySQL.
MongoDB is a leading NoSQL database and an open-source document database that is written in the C++ programming language.
It uses lists and records instead of tables and rows, as in conventional relational databases. Documents are made up of key-value pairs, which are MongoDB's basic data unit. Collections are the equivalent of relational database tables in that they contain collections of documents and functions.
Most of the time, web developers or programmers writes the code that will perform most data manipulation within websites. Therefore, many developers only focus on database management and study it further to gain expertise in the field.
Web Development is a diverse topic which spreads out into many categories, the basics of which are covered in this blog. After getting familiarized or getting refreshed with the basics of how the web works, front-end and back-end web developing technology as well as how to manage data, the next steps can be to get deep into the other tools involved in web development or exploring the most efficient way to develop websites that attracts more traffic.
For business owners who familiarized themselves with the knowledge of web development, now is the time to build up that good communication with the developing team or web development firm you want to hire to build up the robust website you dreamt for your business.
The smartest way to start is by looking at the local web development companies like Dcastalia who provide a wide array of services for all the stages of web development such as from web designing to web maintenance or simply the entire package that allows the whole team of designers, developers and QA specialists to look after your needs.