Web development can often be very complex. Today, for beginners, I want to introduce you to 26 concepts and techniques, one for each letter of the English alphabet. Sounds weird, so let’s get started.
A——Ajax
AJAX stands for asynchronous javaScript and xml, and it's the main driving force behind all the fluent web applications you've used in recent years. As a technology, AJAX is already widely used. Gmail, Flickr, etc. You can even find it in the WordPress admin panel. So what exactly is it and how does it work?
At its core, it is xmlhttpRequest, which allows sending requests and receiving responses after the page has been fully rendered, without having to associate with other parts of the page. This means that web applications do not need to refresh the entire page for every operation. This provides a very smooth, dynamic desktop app-like user experience.
Related reading
How to Make AJAX Requests With Raw Javascript
24 Best Practices for AJAX Implementations
Submit A Form Without Page Refresh using jQuery
B——Browser (browser)
A browser is the thing that understands the structure of your website or app masterpiece. Not only can it be used to surf the Internet, a modern browser is also a multi-tasking platform. For example, I installed it with IRC, FTP and the ability to synchronize information to each device. You may already know that the browser is a valuable development tool, but it also brings a lot of trouble. Every developer who has to ensure that their work looks perfect in every browser should understand this pain.
Related reading
13 Ways to Browser Test and Validate Your Work
Top 5 Ways to Browser-Test your Website
9 Most Common IE Bugs and How to Fix Them
C——CSS
CSS is a sharp sword in front-end development. CSS, short for Cascading Style Sheets, is a language that defines how web pages are displayed. In the scariest days of web development, developers often wrote style code into HTML source code. CSS separates style from content very well.
Related reading
The 30 CSS Selectors you Must Memorize
30 CSS Best Practices for Beginners
Understanding CSS Specificity
CSS: Noob to Ninja – The Complete Video Series
D——DOM
DOM is short for Document Object Model, which is the accepted convention for interacting with HTML or XML documents. The DOM API provides functions for programmatically traversing and manipulating documents. "DOM creates a consistent hierarchical structure for the parsed HTML document. Child elements are called nodes or DOM nodes." If you hear people talking about DOM, they are actually talking about DOM scripts. This was previously a term describing accessing and manipulating the DOM via JavaScript. This is the technology behind most modern websites and apps you see today.
Related reading
JavaScript and the DOM Series: Lesson 1
Javascript and the DOM: Lesson 2
The Dom is a Mess – Lecture by John Resig
E——Events
Modern web applications are deeply event-driven. So what is an event? Most things you do on a web page form an event. Placing the mouse on a link, clicking a button, pressing the Tab key, etc. are all valid events. Event handling refers to executing a specified piece of code when an event occurs. This is also the basic concept behind modern web development that you must master.
Related reading
JavaScript from Null: Chapter 5 – Events
JavaScript Events from the Ground Up
JavaScript from Null: Cross-Browser Event Binding
JavaScript Event Delegation in 4 Minutes
F——Firebug
If a worker wants to do his job well, he must first sharpen his tools. The same goes for web developers. A very powerful tool is Firebug. Firebug is a Firefox extension that works throughout your work. It lets you edit and monitor every aspect of a page on the fly. I can’t go into details about its features here, so click on the link below.
Related reading
10 Reasons Why You Should Be Using Firebug
How to Theme any CMS Using Firebug
Firebug: White to Black Belt
G - Grid
A grid is a visual framework for structuring a page. It was transplanted from the once developed printing industry, and the grid is an essential part of current web development. There are many CSS frameworks that can be used to create grid-based layouts, which require intensive practice for a very large number of pages and layouts.
Related reading
A Detailed Look at the 960 CSS Framework
A Closer Look At the Blueprint CSS Framework
Crash Course: YUI Grids CSS
Mastering the 960 Grid System
H——HTML
If you are reading this article now, you may have some vague idea of its concept. If you were fooled by this link, please continue reading. By the way, welcome everyone to visit rockux. We provide many articles about web development. HTML is the abbreviation of Hypertext Markup Language and is the de facto standard for web language. HTML is made up of several components or elements: tags, tag attributes and the content contained within the tags. The latest version of the HTML standard, HTML5, brings us many new features and resolves some compatibility issues.
Related reading
“HTML5 and You” Course
30 HTML Best Practices for Beginners
28 HTML5 Features, Tips, and Techniques you Must Know
The 10 HTML Tags Beginners Aren't Using
I - IE
Uh, Internet Explore. The name evokes awe and anger. It was a hero, bringing four exciting new features that pushed the entire industry forward, and it also ended the history of browser stagnation. To this day, it still leads front-end developers. After ten years of war, the last version of IE is 9, and it has returned to the right direction of innovation. Regardless of your attitude towards IE, it is still an inescapable part of the web development process.
Related reading
The Things Internet Explorer Got Right
9 Most Common IE Bugs and How to Fix Them
Did Internet Explorer get the Box Model Right?
J - JavaScript
JavaScript is the final member of the basic web development trifecta. JavaScript, not Java, is the scripting language of the Web. There are billions of web pages using it, and more importantly the websites backing up the claim. You define behavior, manage events, manipulate the DOM and interact with the server through JavaScript. The understanding and knowledge of JavaScript is growing every year thanks to the use of incredible libraries such as jQuery. I think it's appropriate to say that JavaScript is an absolute must-have for every modern web developer.
Related reading
24 JavaScript Best Practices for Beginners
JavaScript from Null: Video Series
33 Developers you MUST Subscribe to as a JavaScript Junkie
K——Keyword Optimization (keyword optimization)
SEO is only relevant to web development, but even so, it's important for web developers to have some basic knowledge of what SEO is and what it can do. Keyword optimization refers to choosing the right keywords for your website and optimizing them so that your visitors can find your website. And when you get into all the SEO principles, remember: content is king. If you have great SEO but poor content, users may find you but leave quickly. If you have good content, users will find you and stay.
Related reading
The Only SEO Tools You'll Ever Need
L——Less
Less is a thorny rose style language. Their website describes LESS as extending CSS's dynamic behavior, such as variables, mixins, operators, and functions, and I tend to favor this approach. LESS is CSS on anabolic steroids. Yes it sounds better to me, but you know what it means. It brings the characteristics of dynamic languages to CSS, thus making style sheets more powerful and easier to manage.
Related reading
How to Squeeze the Most out of LESS
You Need to Check out LESS.js
Never Type a Vendor Prefix Again
M——MVC
The Model View Control pattern, better known as the MVC pattern, is one of the most used patterns in web development. This is an architectural pattern that splits each part of a web application into logical chunks for easier maintenance - the model handles the data, the view handles the presentation and the controller is responsible for the data flow between the two parts.
If you use a modern web development framework, you use MVC. Ruby on Rails, Code Igniter and Zend Framework all use this pattern.
Related reading
MVC for Noobs
Create your First Tiny MVC Boilerplate with php
asp.net from Scratch: MVC
N - node.JS
node.JS leads web development into a new era. It makes it possible to run JavaScript on a very fast VM (V8) engine. The results of this shift in thinking patterns may not be immediately apparent, but over time the advantages will become apparent.
The incredible speed and ability to manage thousands of concurrent IO events are major talking points for JavaScript developers around the world.
Related reading
Learning Server-Side JavaScript with Node.js
Node.JS Official Site
O——Object
Object-oriented programming has been widely accepted by the programming community because of its flexibility. Using OOP you can write fewer lines of code, making it cleaner and therefore easier to maintain. But what exactly are objects? It’s hard to explain clearly in one or two sentences, so look at the link below.
Related reading
Object-Oriented PHP for Beginners
The Basics of Object-Oriented JavaScript
Wikipedia link
P——PHP
PHP is undoubtedly the most popular server-side language - it powers millions, possibly billions, of web pages and applications.
Despite a slew of updates and debates as the better choice for writing web applications, PHP has not only survived, but thrived. WordPress, Joomla, Drupal, MediaWiki all use PHP as the backend language. One of the main reasons is that deployment is easy and you can relatively easily find a host that supports PHP.
Related reading
30+ PHP Best Practices for Beginners
Why You're a Bad PHP Programmer
9 Useful PHP Functions and Features You Need to Know
Q——Query
Queries in our articles can mean many things. Query language is an interface used to obtain data from external systems. SQL is a good example of getting information from a relational database.
The query string, on the other hand, is the piece that is passed to the web application as part of the URL. This data could be anything from the page the user is accessing to verify an ID or transaction. Query strings are formatted as key-value pairs.
Related reading
CodeIgniter from Scratch: Search Results without Query Strings
“Popular Posts By Comment Count” SQL Query in WordPress
R - Regular Expressions
Regular expressions provide a flexible way to match strings in text according to specified patterns. It is written in a specific language and parsed by an interpreter. All modern languages support regular expressions.
Related reading
Regular Expressions for Dummies: Screencast Series
You Don't Know Anything About Regular Expressions: A Complete Guide
Advanced Regular Expression Tips and Techniques
S - Source Control (source control)
Source control is a popular practice within a team's development process, no matter what aspect they focus on - programmers in any field use source control. But what exactly is it? Simply put, source control allows a team of developers to work on a collection of files, tracking and identifying each member's changes. Each version of the code can be compared, merged or even restored.
Related reading
Terminal, Git, and GitHub for the Rest of Us: Screencast
A Visual Introduction to Git
Easy Version Control with Git
Getting the Hang of GitHub
T - TDD (Test Driven Development)
This is again a common element among all developers. TDD is the abbreviation of test-driven development, which refers to the process of executing code and automating test cases for this code at the same time. This removes a lot of tedious software testing and encourages developers to test more.
Related reading
The Newbie's Guide to Test-Driven Development
Test-Driven JavaScript Development in Practice
How to Test your JavaScript Code with QUnit
U —— Unit Testing (unit testing)
Unit tests are a series of TFFs where small units of code are tested to ensure they are releasable. However, unit testing is often related to methods in OPP, which usually means the smallest unit of the program that can be tested independently.
Related reading
How to Test your JavaScript Code with QUnit
V——VIM
VIM is a very extreme text editor. Vim is free, open source, and has countless feature packages to choose from. On the other hand, its learning curve is almost unbearably steep, and without good resources you could be lost for a long time. Click the link below to see why it's worth your while.
W - WordPress
WordPress started out as a minimal blogging system, but it has now expanded incredibly. Its scalability allows it to be used for everything from CMS to e-commerce systems. It also has a lot of enthusiasts and followers, including developers and designers, who want to make it a reliable platform that you can rely on for future websites.
Related reading
How to Create a WordPress Theme from Scratch
Essential Plugins for Every WordPress Installation
Scaling WordPress for High-Traffic
Top 50 WordPress Tutorials
8 Great WordPress SEO Plugins
X——XSS
XSS stands for Cross-site scripting. This is one of the many security questions you may ask when creating a website. XSS refers to the act of loading a vulnerable website or program with malicious scripts to escalate privileges or obtain sensitive information, often both.
Related reading
Can You Hack Your Own Site? A Look at Some Essential Security Considerations
CodeIgniter from Scratch: Security
5 Helpful Tips for Creating Secure PHP applications
Y——YUI
Yahoo User Interface Library is a JavaScript library that simplifies the process of creating interactive websites. Like most modern libraries, it provides DOM manipulation and ready-to-use AJAX. Although not as famous as jQuery, YUI still has a very large user base, and it has been actively developed.
Related reading
An Introduction to YUI
2010 Through the Lens of YUI Theater
Z——Z index
Z-Index is a CSS property that defines how an element stacks up on the page - it defines how close an element is to the top of the viewport. A large value indicates that it will appear above the element with a small value. While this property may be relatively specialized, it comes into play immediately when you create widgets or more complex web designs.