Introduction to Integrative

Programming and
Technologies
WEB DEVELOPMENT
COMMON TERMS
BRYAN V. FLORES
 Categories of Web Developer
Specializations
 Front end
 Visible parts of a website or app
 Back end
 “under the hood” databases and infrasructure
 Full stack
 Hybrid of both.
 Tools and technologies for Front End
Development
 HTML
 CSS
 JavaScript
 JS advances served as “back end” programming language
i.e.
Framework such as:  React.js
 AngularJs  Ember.js
 jQuery  Meteor.js
 Node.js  Backbone.js
 Vue.js
 Tools and technologies for Front End
Development Cont’d.
 Responsive Design
 Becoming the standard approach to all web design
 A design that adapts to the user’s device
 Tools and technologies for Front End
Development Cont’d.
 Semantic markup
 An approach to code HTML where the markup tags used to
describe content also provide relevant metadata about the
content itself.
 Tools and technologies for Front End
Development Cont’d.
 SaaS -> stand for “Software as a Service” which describes
everything from Google Docs to Photoshop Express
i.e.
-Microsoft Office Online
-Google Docs
-Photoshop Express
 Tools and technologies for Front End
Development Cont’d.
 A/B Testing
 Enables you to trial different versions of a web page

 Trial different layouts of web pages, tracking how many users convert to paying
customers using the alternative layouts
 Tools and technologies for Front End
Development Cont’d.
 ARIA -> stands for :Accessible Rich Internet Application)
 Refers to screen-reading software, structural layout
approaches, and design methodologies such as user-focused
interface design, aiming the accessibility of content and
functionality.
 Tools and technologies for Front End
Development Cont’d.
 Information Architecture (IA)
 Revolves around how a website is organized
 Making easy for the users to find the information they’re
looking for
 Increase conversion, revenue and user satisfaction
 Tools and technologies for Front End
Development Cont’d.
 Visual Hierarchy
 Arranging design elements so as
to emphasize some over others
 This emphasis is normally
achieved through the use of
size, colour, font and special
effects such as drop shadows.
 Visual hierarchy is often a
conscious decision as a result of
an Information Architecture
process.
 Tools and technologies for Front End
Development Cont’d.
 Infinite/parallax scrolling
 Infinite scrolling and parallax scrolling
are two related techniques that are
becoming increasingly popular
 Infinite scrolling is a way to present a
site that rather than loading separate
pages, all page content is loaded into a
single page
 Parallax is the effect seen when items
closer to your viewpoint appear to move
more quickly that items farther away.
 Tools and technologies for Back End
Development
Languages & Frameworks Databases
 PHP  MySQL
 Ruby on Rails  PostgreSQL
 Python  MongoDB
 Node.js
 Laravel
Web Serer Technologies
 Apache
 NGINX
Git Clients & Services
 SourceTre
 Github Client
Local Development Environments
 XAMPP
 WampServer
 Laragon
Web Development Communities
 Stackoverflow
 Refind
 Hashnode
NOTE:
Back end developers generally work with a front end developer
 Tools and technologies for Web
Development
 301 Redirect -> This type of redirect is usually used to
redirect from an old website page to the new website
page.
 404 -> 404 is an error message that a user sees when what
was requested cannot be found.
 API -> stands for “Application Program Interface.” This is
how computers and applications can communicate with
one another.
 Bandwidth -> an amount of data that can be transmitted
over a connection in a given time
 Tools and technologies for Web
Development
 Breakpoints / Media Queries -> They are usually industry
set, such as mobile, tablet, and desktop, but your
developer can adjust as needed to match your specific
audience.
 Cache -> is temporary data storage that helps site speed
by storing relevant information on your computer the first
time you visit a website.
 Cookies ->This is data saved by your web browser on to
your computer. It identifies you -- from how often you
visit a site, to what parts you visit the most, even your
preferences when browsing and more.
 Tools and technologies for Web
Development
 Crawl -> This is what it is called when a search engine
sends a bot to your website to gather information on
pages that exist and no longer exist and update their
database on the information it has gathered. It is
necessary to get indexed by search engines and get found.
 CDN -> CDN stands for “Content Delivery Network.” This is
a system of computers with scripts and other content that
are used by many websites.
 Favicon -> Short for “Favorite Icon,” this is the icon that
appears in your website browser tab.
 Tools and technologies for Web
Development
 Framework -> “a package made up of a structure of files
and folders of standardized code (HTML, CSS, JS
documents etc.).”
 Hosting -> Hosting refers to a web server where the files
for your website are stored.
 Search Engine Optimization (SEO) -> You know this one!
SEO is the process of creating and modifying content for
the best visibility on search engines.
 SERP -> SERP stands for Search Engine Results Pages and
are pages that display the results from a searcher's search
query.
Tools and technologies for Web
Development
 References

 Morris, Scott. (2019). FULL STACK, FRONT END, BACK END—WHAT DOES IT ALL
MEAN?Retrieved from https://skillcrush.com/2017/02/27/front-end-back-
end-full-stack/