Home Using HTML Using CSS Using JS Management Dev Environ Resources

code Introduction

Learning to build web applications is an arduous process that requires a sprinkle of intelligence, a splash of determination and a whole lot of patience. I created this repository of resources to highlight my knowledge as a web developer.

This page provides an overview of the technical aspects pertinent for jumpstarting a career in web development. It offers a simple no-frills guide for preparing a computer to handle the demands of programming a web application.

As you read, be sure to investigate the contextual links provided (all underlined).


Setting Up your Dev Environment

This section highlights the main aspects required for establishing a proper developers environment. Aside from owning a computer and having access to the internet you will also need:

  1. an IDE text-editor to program your application
  2. a Local Host-Server to work on a project in real-time offline
  3. a Version Control System to manage your work
Integrated Development Environment

An Integrated Development Environment (IDE) is a software application suite that combines tools required to write and test software, and is typically composed of a source code editor, build automation tools (i.e. compiler, interpreter), and a debugger.

Example of Brackets Text Editor
The Brackets IDE

IDE's are designed to maximize programmer productivity by providing versatile components within a single program of which all development is done. IDE's typically provide features for authoring, modifying, compiling, deploying and debugging software, which helps developers quickly execute actions without switching to other applications.

One aim of the IDE is to reduce the configuration necessary to piece together multiple development utilities, instead providing the same set of capabilities as a cohesive unit. Reducing that setup time can increase developer productivity, in cases where learning to use the IDE is faster than manually integrating all of the individual tools. Tighter integration of all development tasks has the potential to improve overall productivity beyond just helping with setup tasks. Without an IDE, a developer must select, deploy, integrate and manage all of these tools separately.

My IDE of choice is Brackets, an open-source, cross-platform software that primarily focuses on web development. Some of the reasons that I am partial to this particular IDE revolve around its various built-in features, including, but not limited to: inline editing of CSS and JavaScript elements; live preview of code in a browser; split pane views to work on two files simultaneously; and multiple file format support to write code using one of thrity-eight languages. As well, extensions can be imported via the built-in extension manager; for that matter, developers can create their own extension, a venture I have yet to attempt. Learn more about How to Use Brackets and explore the various-extensions available for use.

LocalHost Server

A Localhost Server is a computer networking configuration that creates an online-like environment for developers to test applications without the need for internet access.

Example of XAMPP Localhost Server
The XAMPP Localhost Server

Specifically, localhost is the default host name that means this computer and uses the IP address 127.0.0.1 to act as a loopback mechanism, which may be used to run a network service on a host without requiring a physical network interface, or without making the service accessible from the networks the computer may be connected to. The 127.0.0.1 is a universal address reserved for localhost; you can locate your computer IP address by selecting ‘start’ and typing ‘cmd’ into the search box. A command prompt will display, then you type ‘ipconfig /all’ and scroll the list until you find ‘IPv4 Address.’

Those good folks at Apache Friends offer an open source cross-platform web server-stack with compatible options for users regardless of computer operating system. My localhost of choice is XAMMP, which is compatible with my Windows OS. It incorporates Apache, MySQL and PHP services in order to facilitate a server, store data, and run PHP scripts that can interact with a database.

Note: Before downloading this program, research alternatives that are best suited for you. Moreover, although outside of the scope of this content, it should be noted that a localhost should not be confused with a Web host, which is a service required in order to publish a website online. The Web host stores and makes files available to computers connected to the Internet website pages.

Version Control System

A Version Control System (VCS) is a software configuration, or source sode manager, that records changes to a file or set of files over time; it is a categorization of processes and tools designed to keep track of different versions of software, content, documents, and websites in development.

Example of the Github Version Control System
The Github Version Control System

For all intents and purposes, a VCS is an online storage repository for your code, enabling developers with the ability to manage source-code, track all file versions and coordinate a non-linear workflow in a team environment. Version control allows servers in multiple locations to run different versions on different sites, even while those versions are being updated simultaneously by a number of different developers. The importance of this feature cannot be understated as this system allows developers to compare revised files, identify differences, and merge changes prior to committing any code.

My VCS of choice is Github due to its integration capabilities. This VCS is well-documented, provides options for using an extension as opposed to the console, and requires authentication when checking-in or out of a repository. Featured tenants of the Github VCS that I enjoy include files never being lost and that those files are always accessible from any location in the world. Moreover, with some tinkering, security features can be implemented using the SSH protocol to synchronously connect with a file server, enabling near instantaneous deployment online. Learn more about How to Use Github and be sure to read the list of Git Commands that I am familiar with and regularly use.

Last Updated: 12/25/2018