*PHP*

Also known as Hypertext Pre-processor, is the most popular server-side programming language.

PHP is often used as the foundation of CMS’s (Content Management Systems) like WordPress and big websites like Facebook and Wikipedia.

*© FORGE*

*LARAVEL*

Laravel is the most popular PHP framework out there. I won’t touch on all of them, but this is most noteworthy.

The main Laravel benefit is that it is made for speed. You will be able to create clean apps and websites much easier and more effectively.

Sites that use Laravel are One Plus and True Lancer.

*© Forge*

*SQL*

SQL (Structured Query Language) is a standard language for database-centred websites and accessing databases. If you need a login system or if you’d be dealing with data/accounts, then you definitely need SQL. By using SQL, you’d need to use a server-side language like PHP for example.

There are a few databases to learn, but to start, I’d recommend MySQL.

As your knowledge of general SQL and MySQL improves, I’d recommend learning MongoDB.

*© Forge*

*C++*

C++ is a general-purpose object orientated programming language. It is considered to be difficult to master, but once you know it, chances are you will love it. C++ runs well with almost every other programming language. Most systems out there can run the C++ code. C++ is a powerful language to use in Microsoft’s .NET Framework.

When to use C++?

Large-scale applications, PC games, game development, video games, application software, operating systems and databases. Companies like Intel, IBM, Microsoft, Adobe and Firefox use C++.

*© FORGE*

*ASP.NET*

Made by Microsoft, ASP.NET is an object-orientated, server side framework which is written using the C# and Visual Basic programming language.

So what can .NET do and where is it used?

Dynamic websites and web apps with HTML5, CSS3 and JavaScript, Enterprise-level software development and web APIs. Websites that use ASP.NET are Dell, ASOS, TacoBell, W3Schools and MSN.

*© Forge*

*NODEJS*

Node.js is a server-side framework for JavaScript. Node.js basically makes JavaScript (which is a front-end script) into a server-side technology. That sounds fancy, but all it means is that Node.js makes the overall website faster and it is perfect for real-time apps/websites that require a news feed, chat rooms, and other data-heavy applications.

Some sites that run on the Node.js framework are: LinkedIn, PayPal, Dow Jones and Groupon.

If you’d like to use Node.js to build server-side applications (or big sites mentioned above), you can use Express.js (this is the framework for Node.js).

*© Forge*

*ANGULARJS*

AngularJS is the most robust of the JavaScript frameworks. It is perfect for data-heavy websites like iStockPhoto, Udemy, Virgin America, Ford, Lego, and GoPro for example.

If you want to create websites that are much simpler than the website examples above, chances are you will be fine with a JavaScript framework like Backbone.js (below).

*© FORGE*

*BACKBONE.JS*

Backbone.js is a ‘light-weight’ JavaScript framework with the sole purpose of making it easy to connect with a site’s server-side application. It loads very quickly and it is ideal for creating awesome single-page web applications that don’t always require a full-page refresh (think Gmail as an example).

Websites that make use of Backbone.js are: Reddit, Pandora and Airbnb.

*© FORGE*

*CMS*

A CMS (Content Management System) is basically a platform that is the simplest way to create a website and make quick changes that (mostly) doesn’t require any coding knowledge — this is a VERY simple overview.

The 2 main CMS’s are: WordPress and Drupal.

WordPress doesn’t really need an introduction, but for the complete newbies, WordPress is responsible for around 25% of the internet! Drupal is considered to be difficult compared to WordPress, however, once you get used to it, it’s pretty powerful in terms of the features, scalability and speed.

*© FORGE*

*GIT*

Git is a version control system that is used for software/web development. It allows you to revert files back to a previous state, revert the entire project back to a previous state, compare changes over time, see who last modified something that might be causing a problem, who introduced an issue and when, and more.

Many large companies and development teams make use of GIT to work and manage projects. Whether you are a web developer in a company or a freelancer, this would be a good move.

*© FORGE*

*GITHUB*

GitHub is a code hosting platform for version control and collaboration. Just like you get a website hosting platform like BlueHost, HostGator or NameCheap for example, GitHub is hosting your code (how cool is that?). To really understand GitHub, you need to understand Git.

You will be able to ‘show off’ all your projects and contribute to other projects you find. It’s almost like a social network for developers.

Note that this is NOT an exhaustive list of programming languages and things to learn about… This is just a list of what I have seen to be popular and noteworthy through my own experience and speaking with many software engineers

*© FORGE*

*Lemme tell you a bit about HTML*

HTML is great. It defines the structure of webpages and it determines how data is displayed online. What you’re looking at on any page in your browser is HTML code, read and interpreted by your browser. But this doesn’t make HTML a programming language.

*Markup Language*

HTML is a type of markup language. It encapsulates, or “marks up” data within HTML tags, which define the data and describe its purpose on the webpage. The web browser then reads the HTML, which tells it things like which parts are headings, which parts are paragraphs, which parts are links, etc. The HTML describes the data to the browser, and the browser then displays the data accordingly.

That’s how the browser knows that

This is a heading

This is a paragraph

, and

_This is a link_

However, this is not programming. The above is not an example of an executable script. The HTML was only used in the above to mark up the text for the browser to read and interpret as web page content. It told the browser which parts where headings, which were paragraphs, and which were links, and the browser displayed them as such. HTML is used for structural purposes on a web page, not functional ones.

*© FORGE*

*Why it is not a Programming Language*

Programming languages have functional purposes. HTML, as a markup language doesn’t really “do” anything in the sense that a programming language does. HTML contains no programming logic. It doesn’t have common conditional statements such as If/Else. It can’t evaluate expressions or do any math. It doesn’t handle events or carry out tasks. You can’t declare variables and you can’t write functions. It doesn’t modify or manipulate data in any way. HTML can’t take input and produce output. Think of it this way: you can’t compute the sum of 2 + 2 in HTML; that’s not what it’s for. This is because HTML is not a programming language.

*© FORGE*

*Still Awesome*

Unfortunately, coding only in HTML doesn’t make you a programmer. In fact, HTML really shines when you use it in conjunction with an actual programming language, such as when using a web framework. That’s when you can start serving up dynamically created web pages and database applications.

But don’t worry, even with pure HTML, you’re still a coder. You’re writing lines of code in a (markup, not programming) language. You’re essentially codifying information for the web. So while you might not want to put HTML on the “Programming Languages” part of your resume, you should definitely have it under “Skills”, or simply “Languages”.

*© FORGE*

Knowledge of web page structure is a valuable asset for anyone to have, in IT as well as in other fields, and I’m definitely not trying to discredit anyone’s knowledge on the awesomeness that is HTML. HTML is a core tenet of front end web development and is obviously a major aspect of what the user winds up seeing on their computer screen. With the emergence of HTML5, HTML’s capabilities and opportunities to define and structure web page data have soared to new heights, with a greater emphasis on multimedia, mobile web, geolocation, and more. This makes a solid understanding of HTML even more useful to have.

*© FORGE*

So keep rocking the HTML, get to know it well, and by all means, code away! Just don’t call it programming.

Still think HTML is a programming language? Think “programming” and “coding” is all just semantics? Let me know by commenting

*© FORGE*

*HTML Beginner Tutorial*

And so it begins! Lemme assume that you have absolutely no previous knowledge of HTML or CSS.

This tutorial should be easy to follow if you read through each sentences and then, to celebrate, everything that’s covered is brought together at the end, before moving on to the CSS Beginner Tutorial.

The primary thing to keep in mind, the supermagic key, is that HTML is used for meaning and CSS is used for presentation. HTML is nothing more than fancy structured content and the visual formatting of that content will come later when we tackle CSS. You might find different approaches elsewhere on the web but *Forge* focuses on best practice from the outset and getting into the frame of mind of doing things the right way from the start will lead to much better results in the end.

*© FORGE*

*Getting Started*

Most of the stuff on the web is no different than the stuff on your computer — it’s just a whole load of files sorted into a whole load of directories.

HTML files are nothing more than simple text files, so to start writing in HTML, you need nothing more than a simple text editor.

Notepad is a common text editor on Windows-based computers (usually found under the Programs > Accessories menu) and Mac OSX computers come bundled with TextEdit but any program that lets you fiddle with text will do.

Type this in to your text editor:

This is my first web page

Now create a folder called “html” wherever you like to save files on your computer and save the file as “myfirstpage.html”.

Be careful. It is important that the extension “.html” is specified - some text editors, such as Notepad, will automatically save it as “.txt” otherwise.

You also need to ensure that your file is being saved as plain text. TextEdit, for example, will start new files as “Rich text”, containing lots of formatting extras, by default. In such cases, go into the preferences and make sure you check the “Plain text” format option before creating a new file.

Link FORGE
If you've found Forge useful, please consider linking us. Dm for all social media links

To look at HTML files, they don’t even need to be on the web. Open a web browser such as Chrome, Firefox, Safari or Internet Explorer and in the address bar, where you usually type web addresses, type in the location of the file you just saved (for example, “c:\html\myfirstpage.html”) and hit return. Alternatively, go to the File menu of the browser, select Open, and browse for the file.

Pow. There it is. Your first web page. How exciting. And all it took was a few typed words.

We’ve said here to use a basic text-editor, such as Notepad, but you may be tempted to use a dedicated software program such as Adobe Dreamweaver.

You should be very careful when using these programs, especially if you are a beginner, because they often throw in unnecessary or non-standard code t co “help” you.

If you’re serious about learning HTML, you should read through a tutorial such as this first, so that you at least have a basic understanding of what is going on.

Software programs such as these will never give you the same control over a web page as coding by hand.

If you do decide to use specialized code-editing software, we recommend one in which you are still coding by hand. They can, in fact, be helpful, especially the more advanced you become, in terms of code syntax highlighting and file management.

*© FORGE*

*Tags, Attributes, and Elements*

Although the basics of HTML is plain text, we need a bit more to make it a nice and shiny HTML document.

*_Tags_*
The basic structure of an HTML document includes tags, which surround content and apply meaning to it.

Change your document so that it looks like this:

<!DOCTYPE html>
<html>
<body>
    This is my first web page
</body>
</html>

Now save the document again, go back to the web browser and reload the page.

The appearance of the page will not have changed at all, but the purpose of HTML is to apply meaning, not presentation, and this example has now defined some fundamental elements of a web page.

The first line on the top, <!DOCTYPE html>, is a document type declaration and it lets the browser know which flavor of HTML you’re using (HTML5, in this case). It’s very important to stick this in - If you don’t, browsers will assume you don’t really know what you’re doing and act in a very peculiar way.

To get back to the point, <html> is the opening tag that kicks things off and tells the browser that everything between that and the </html> closing tag is an HTML document. The stuff between <body> and </body> is the main content of the document that will appear in the browser window.


On a long-established, well-read, well-respected web development resource.
Closing tags
The </body> and </html> put a close to their respective elements (more on elements in a moment).

Not all tags have closing tags like this (<html></html>) some tags, which do not wrap around content will close themselves. The line-break tag for example, looks like this : <br> - a line break doesn’t hold any content so the tag merrily sits by its lonely self. We will come across these examples later. All you need to remember is that all tags with content between them should be closed, in the format of opening tag → content → closing tag. It isn’t, strictly speaking, always a requirement, but it’s a convention we’re using in these tutorials because it’s good practice that results in cleaner, easier to understand code.

You might come across “self-closing” tags, whereby a br tag, for example, will look like “<br />” instead of simply “<br>”. This is a remnant of XHTML, a form of HTML based on another markup language called XML. HTML5 is much more chilled out than XHTML and will be happy with either format. Some developers prefer one way, some prefer the other. We tossed a coin and decided to stick with the simpler version.

*Attributes*
Tags can also have attributes, which are extra bits of information. Attributes appear inside the opening tag and their values sit inside quotation marks. They look something like <tag attribute="value">Margarine</tag>. We will come across tags with attributes later.

Once again, quotation marks aren’t always essential but it is a good-practice convention Forge uses for consistency and clarity. We suggest you do the same.

*Elements*
Tags tend not to do much more than mark the beginning and end of an element. Elements are the bits that make up web pages. You would say, for example, that everything that is in between (and includes) the <body> and </body> tags is the body element. As another example, whereas “<title>” and “</title>” are tags, “<title>Rumple Stiltskin</title>” is a title element.

*© FORGE*

*Page Titles*

All HTML pages should have a page title.

To add a title to your page, change your code so that it looks like this:

<!DOCTYPE html>
<html>
<head>
    <title>My first web page</title>
</head>
<body>
    This is my first web page
</body>
</html>

We have added two new elements here, that start with the head tag and the title tag (and see how both of these close).

The head element (that which starts with the <head> opening tag and ends with the </head> closing tag) appears before the body element (starting with <body> and ending with </body>) and contains information about the page. The information in the head element does not appear in the browser window.


We will see later on that other elements can appear inside the head element, but the most important of them is the title element.

If you look at this document in the browser (save and reload as before), you will see that “My first web page” will appear on a tab or the title bar of the window (not the actual canvas area). The text that you put in between the title tags has become the title of the document (surprise!). If you were to add this page to your “favorites” (or “bookmarks”, depending on your browser), you would see that the title is also used there.

*© FORGE*