Application Development

void main() {
procrastinate();
startPresentation();
answerQuestions();
cullPeanutGallery();
killTime();
exit();
}
What is Application Development?
Definition: Process of creating a software application that performs a task.

Types: Desktop, Mobile, Tablet, Web, Cloud, Database

OS Platforms: Microsoft Windows, Apple OSX, iOS, Android, Linux

Why be interested in Application Design/Development?
● The future is dependant on Information Technology (77 billion dollar industry).

● US Bureau of Labor Statistics has estimated that by 2020, there will be

1,000,000 more computing jobs than applicants who can fill them. IT is a
highly lucrative field, and a great investment for the future.

● Become a part of the future, as many IT fields are working with

state-of-the-art software, artificial intelligence, advanced robotics and more.

● Application design/dev allows for a lot of creativity, not just in designing

interfaces. There are tons of ways to achieve the same result, using different
methodologies and finding more efficient ways to reduce lines of code can
become an art.
Amazon Warehouse Updated
 Average Developer Salaries (US)

$66,317 $65,587 $57,000

(Entry Level) (Entry Level) (Entry Level)
$59,611 $58,000 $61,128 $60,000
(Entry Level) (Entry Level) (Entry Level) (Entry Level)

$79,954 $84,330 $76,540

(5 Years) (5 Years)
$73,549 (5 Years) $72,500 $82,611 $92,000
(5 Years) (5 Years) (5 Years) (5 Years)
Source: glassdoor.com
Creativity, Imagination & Drive
“Imagination is more important than knowledge” - Albert Einstein

You don’t need to be a computer expert, a

mathematician, or a huge nerd to thrive in the field of
IT.

There are many different ways to solve a problem,

and bringing a different point of view is crucial in
solving complex problems, refactoring code, and
creating more effective solutions.
Application Development Stack
Front-End (Client-Side): Everything the user sees and interacts with on screen
(interface). Front-End communicates back and forth using requests with the
Back-End to process information.

Interface: Visual representation of an application. Primarily the controls.

Back-End (Server-Side): Program logic that runs behind the scenes, triggered
by the Front-End to perform tasks.

Database: Storage of information that the back-end communicates with

to process/store data. User accounts, program data, files, etc.
Consumer Grade Artificial Intelligence
Voice activated, virtual assistant appliances are used for music playback, making
to-do lists, setting alarms, playing audio books, and several other functions.

Google Assistant (Google Home) Amazon Alexa (Echo)

Advanced Robotics
Boston Dynamics is an American engineering and robotics design company founded in 1992 and headquartered in Waltham, Massachusetts,
that specializes in the research and design of advanced robotics.

The company is best known for the development of BigDog, a quadruped robot designed for the U.S. military with funding from Defense
Advanced Research Projects Agency (DARPA).

On 13 December 2013, the company was acquired by Google.

Standard Desktop Application
● Self contained application that has front-end/back-end built into itself.

● Does not require an internet connection.

● Runs locally on users’ machine

Single Player Games Standard Desktop Applications

Client-Side Application
Application that is broken into two parts, the client-side and server-side. Client-Side part of
application is ran locally on users’ computer and communicates back and forth between the
Server-Side.

● Front-End (user interface) is displayed locally on users’ device.

● Requires internet connection to work properly, as only part of the application is exists on
users’ computer.

Websites with authentication Multiplayer Games Online Applications

Server-Side Application
Back-End portion of application that does computations, fetched data and communicates
back to client application.

● Does the behind-the-scenes work to deliver client-side application with validation, data,
and resources, which leads to improved security over a traditional desktop application.

● More applications are becoming reliant on servers to run the bulk of application, so the
user doesn’t require a powerful computer to run an advanced application.

Cloud Processing Multiplayer Servers Online Storage

Front-End / Back-End Road Map
Front-End Back-End
Database

Website / Web App

Server
Desktop App

File Server

Mobile App
Client-Side / Server-Side Road Map

Server Side
Client Side
Back-End
Database

Internet

Server

File
Front-End Server
Questions? Comments? Concerns?
Quiz #1 - Application Development

http://apps.palmbeachschools.org/PocketQuiz/Home
[email protected]

Password: Manhattan46
Web Design & Development
<html>
<head>
<title>
My Awesome Website
</title>
</head>
<body>
What is Web Design?
Process of creating the design portion of a website. Interface design, graphic
design, usability design, accessibility design. (Create the look and feel of
website).

● HTML

● CSS

● Graphic Files (jpg, gif, png)

Please don’t use bitmaps!
What is Web Development?
Process of creating the functionality of a website.

Scripting code for website functionality (javascript, php, etc).

Front-End Dev (wiring up interface controls to communicate with back-end).

Back-End Dev (creating server-side application to deliver data).

Parts of Website (DOM)
The DOM (Document Object Model) is the interface that makes up a website. The
browser reads in HTML and builds a visual representation on your screen.

Example: <img src=”honeybadger.jpg”> Example: <a href=”google.com”>Click

here to get to Google</a>
Browser renders:
Browser renders: Click here to get to
Google
Image Formats in Web Design
● Jpeg: Most common image format. High quality/compression. Does not
support transparency.

● GIf: Supports transparency & animation, but lacks the quality of jpeg/png.

● PNG: High quality image format. Larger size than jpeg. Supports
transparency.

● Bitmap: Do not use a bitmap in web design! Huge filesize and no benefit!
HTML5: What it be?
Hypertext Markup Language - Version 5

Standard scripting language for tagging text files to achieve web formatting
effects, such as font, color, graphic and hyperlink effects on a website. It’s also
cross-platform and royalty free!

What’s new in version 5?

HTML5 can now do animation, play embedded videos and create web applications
that prior to it’s release, required browser plugins such as Flash and Shockwave to
perform.
Websites using HTML5

https://www.ringba.com/white-label/

https://lusion.co/

https://www.dodge.com.mx/muscle
HTML Example
CSS
Cascading Style Sheets

Simple style definitions for HTML elements. Saves redundant work by definition
styles for select elements, and being able to apply them on an entire website.

Stay organized and quickly change the look of a website without having to change
all the pages individually.
CSS Example
No Style
Style 1
Style 2
Style 3
Web Scripting
Programming languages for adding dynamic capabilities to a website.

Gives you the ability to make changes to your website by changing the DOM.
(Make changes to the background color, change images in a slideshow, animate
certain html elements).

Load data from a back-end server (fetch user data from a database, validate a
users’ identity, or load resources from a file server).
Examples of Scripting Languages
Javascript: Most popular client-side scripting languages. Goes hand in hand with
HTML/CSS, and runs in the browser.

PHP (Hypertext Preprocessor): Server-side scripting language primarily used for

Back-End processes. Commonly used together with Javascript.

ASP (Active Server Pages): Development framework for building websites.

Encompasses both Front-End and Back-End development.
Questions? Comments? Concerns?
Quiz #2 - Web Design / Dev

http://apps.palmbeachschools.org/PocketQuiz/Home

Password: Manhattan46
Influences in Technology
Taking over the world since 1946
ENIAC - Electronic Numerical Integrator and Computer
Created on February 15th, 1946 at the University of Pennsylvania.

Total cost was ~$487,000 dollars to develop (~$6,887,000 today).

Weight over 27 tons, was 1,800 sq ft of space, and consumed

~150 kW of electricity (average computer today uses 150 watts, or
one thousand times less energy), thus causing massive brownouts
throughout the university. It was rumoured, that whenever the
ENIAC was switched on, lights throughout all of Philadelphia
dimmed.

Designed to calculate artillery firing tables with nuclear missiles for

US Army’s Ballistic Research Laboratory.

Powerful enough to calculate a missile trajectory that took a

human over 20 hours, in just 30 seconds.

Source: wikipedia, britannica.com

Average Home Computer
CPU: 3.6Ghz Processor
Memory: 8GB RAM
HardDrive Space: 1TB HD
Price: $599.00
Influences in Technology - Henry Ford
“Nothing is particularly hard if you divide it into small jobs.”

● Founded Ford Motor Company.

● Created assembly line which reduced time it took to build a car from
twelve hours to two hours and thirty minutes. December 1st, 1913.

● Offered $5 dollars a day wage, which was double the average, that
brought in skilled laborers from other companies.

● Created five-day work week which gave workers more leisure time and in
turn, made them more productive. Henry Ford
Founder of Ford Motor Company

Source: wikipedia, history.com

Source: https://www.youtube.com/watch?v=PZnGWJ_6BwU
Influences in Technology - Steve Jobs
“Everybody in this country should learn to program a computer,
because it teaches you how to think”

● Dropped out of college to co-found Apple Inc (1976), became

chairman to Pixar and member of Disney’s board of directors.

● Apple created one of the first highly successful, mass produced,

personal computer in the world. Modern User Interface and mouse
based on early Apple designs.

● Forced out of Apple in 1985. Rejoined Apple in 1997 and became

the CEO within just a few months, and saved company from
bankruptcy. Steve Jobs
Founder of Apple
● Revolutionized digital music with iPod and iTunes.

● Revolutionized smartphone market with release of iPhone.

Source: wikipedia
Source: Pirates of Silicon Valley (1999) TNT
Influences in Technology - Elon Musk
"When Henry Ford made cheap, reliable cars, people said, 'Nah, what's wrong
with a horse?' That was a huge bet he made, and it worked."

● Began learning programming by himself at age 12.

● Dropped out of college to pursue entrepreneurship to create both Zip2 and

spacex.com. Both companies were sold, first to Compaq and then
Paypal, totaling 1.8 billion dollars.

● Founder of SpaceX, co-founder of Tesla Inc and OpenAI.

● Working towards reducing global warming through sustainable energy, Elon Musk
and establishing a human colony on Mars. Founder of SpaceX

Source: wikipedia
Source: https://www.youtube.com/watch?v=reMTcjw_Tcw
Questions? Comments? Concerns?
Quiz #3 - Influences in IT

http://apps.palmbeachschools.org/PocketQuiz/Home

Password: Manhattan46
Professional Skills in IT
The Non-technical aspects of the IT world
Teamwork
The combined action of a group of people, working together to reach a common
goal. Our goal in this instance would be to develop a product that will provide the
best experience possible for the end user (customer).

Communication: How well do the members of the team discuss the development
process?

Collaboration: How well do members of the team work together on a piece of the
project?

Creativity: How do we use imagination and original ideas to aid in production of a

project?

Innovation: How do we improve a process or particular area of a project?

Software Development Methodologies
System of methods applied to the software development process. Basically, rules
for developing software with a team of people.

Popular Types:

Waterfall Development: Linear approach, flows downwards like a waterfall.

Agile Development: Requirements and solutions evolve throughout the software

development process.

Spiral Development:
Customer Care
A customer in software development is a person or group that tasks us with a
product that needs to be created and delivered, based on their specific needs.

Most customers are not tech-savvy, and require a team to cater to their needs,
which is why it’s important to communicate with your customer during the
application development process.

The software application is always based on

the customers’ needs, and they may want all
the bells and whistles, but sometimes the
most simplistic designs can be exactly how a
customer wants their product.
The Importance of Self Learning/Study (Autodidacticism)
auto-die-dac-tism
Definition: Education without the guidance of teachers/professors.

● Explore new areas of interests. Encourages curiosity.

● Learn at your own pace and your own leisure.

● Develop skills that are above and beyond your regular classmates.

● Boosts confidence and self-esteem.

● Branch off into other areas of interest and further your knowledge.
Resources & Where to find them ~
● Your local library

● The Internet

● Clubs / Code Camps / Events

● Friends & Family

Questions? Comments? Concerns?
Quiz #4 - IT Skills

http://apps.palmbeachschools.org/PocketQuiz/Home

Password: Manhattan46
 Automation
The world of tomorrow, today!
What is automation?
● The use of automatic equipment in a system of manufacturing or other
process.

● Developments of machines and automation software in the workplace to

improve production and reduce costs.

● Machines set to overtake humans in the workforce

by 2025.
Automation and the Job Market
● Estimated 45% of all jobs may be replaced by automation (80 million) by 2030.

● Artificial Intelligence & Robotics to create 58 million jobs by 2022.

● An additional 133 million jobs are set to emerge to help transition the process and fill in
the gaps.

● Computer Science / Engineering jobs set to be in top 10 fastest growing and high
demand jobs.

● Green Energy currently fastest growing field across all job sectors.

Source: cnbc.com - https://www.cnbc.com/2018/09/17/wef-machines-are-going-to-perform-more-tasks-than-humans-by-2025.html

Source: Humans Need Not Apply https://www.youtube.com/watch?v=7Pq-S557XQU
Pros / Cons of Automation
● Boost productivity

● Lower cost of goods and services

● Reduce risk of human injury on job

● Reduces number of jobs in the market

● Increased energy consumption

● High cost of entry

Top 10 Occupations in the US by Field

Source: US Bureau of Labor Statistics https://www.bls.gov/oes/current/oes_nat.htm

Source: CNN Business https://www.youtube.com/watch?v=2u007Msq1qo
Questions? Comments? Concerns?
Quiz #9 - Automation

http://apps.palmbeachschools.org/PocketQuiz/Home

http://l.sdpbc.net/dy8yv
 FIRST Robotics Club
For Inspiration & Recognition of Science & Technology
Vision & Mission
Inspire people to be science and technology leaders and innovators, by engaging them in
exciting mentor-based programs that build science, engineering, and technology skills, that
inspire innovation, and that foster well-rounded life capabilities including self-confidence and
leadership.

“FIRST is more than robots. The robots are a vehicle for students to learn
important life skills. Kids often come in not knowing what to expect - of the
program nor of themselves. They leave, even after the first season, with a vision,
with confidence, and with a sense that they can create their own future” - Dean
Kamen
FIRST Core Values
● Discovery: We explore new skills and ideas.
● Innovation: We use creativity and persistence to solve problems.
● Impact: We apply what we learn to improve our world.
● Inclusion: We respect each other and embrace our differences.
● Teamwork: We are stronger when we work together.
● Fun: We enjoy and celebrate what we do!
Programming FIRST Robot
● Google Blockly - visual coding language built by Google.

● Simple, easy to use drag and drop controls are perfect for entry level users.

● Requires no compiler or additional software (can run off web).

● Automatically converts what you design into Javascript, php, python, LUA,
Dart and/or other languages.

● 100% free to use.

Perks of joining FIRST
● Design, build, program and operate robots to compete in a head-to-head
challenge in an alliance format.

● Robot operates on a field that contains missions and obstacles to score points
for your team.

● Technical and non-technical skills are welcomed and needed.

● Builds skills in engineering, programming, and teamwork.

● Earn scholarships and other exclusive educational funding.

FIRST Programs
● Lego League Jr: Ages 6-10

● Lego League: Ages 9-14

● Tech Challenge: Grades 7th-12th

● Robotics Competition: Grades 9th-12th

How to join FIRST
Contact your guidance counselor or academic coordinator to learn about the
availability of FIRST programs at your school.

Visit the FIRST website: https://www.firstinspires.org/

Speak to your parents about joining or creating your own team:

https://www.firstinspires.org/resource-library/youth-team-member-consent-and-release-form
Questions? Comments? Concerns?
Quiz #8 - FIRST Robotics

http://apps.palmbeachschools.org/PocketQuiz/Home

http://l.sdpbc.net/dy8yv
Questions? Comments? Concerns?
In Closing...
Have a fun, educational & safe summer!
 http://www2.palmbeachschools.org/palmsprings/
Resources
Website from presentation

Self Learning Resources:

https://www.w3schools.com

https://www.codecademy.com

https://www.khanacademy.org

https://developers.google.com/blockly/

https://www.firstinspires.org/robotics/frc
Quiz #5 - School Information

http://apps.palmbeachschools.org/PocketQuiz/Home

http://l.sdpbc.net/dy8yv
Quiz #6 - Programming Questions

http://apps.palmbeachschools.org/PocketQuiz/Home

http://l.sdpbc.net/dy8yv
Quiz #7 - Bonus Round

http://apps.palmbeachschools.org/PocketQuiz/Home

http://l.sdpbc.net/dy8yv