TT284 Employability Skills: Starts at 19:00
http://xkcd.com/192/
Slide 2
TT284-14J Employability Skills Karl R. Wilcox Start the
recording!
Slide 3
Important Disclaimers about this Presentation! Nothing in it
will help you with the EMA But it may help in your future career In
common with 87%* of all statistics, figures quoted here are made up
on the spot * including this one
Slide 4
How to Approach this Presentation This will be a massive
information dump that is not immediately relevant to the module But
it I hope it is both interesting and useful to you at some time So
Sit back, relax and let it all wash over you It will come back to
you when you need it
Slide 5
Education Vs. Reality Venn Diagram Stuff that actually goes on
Stuff you get taught Stuff you get tested on
Slide 6
What We Will Cover Looking at some snapshots of parts of the
Stuff that actually goes on What (really) is a Website? Frameworks
PHP & Javascript Development iPhone App Development Hence, try
to Quantify the Venn Diagram* Where can you find out more? Where
can you go from here? * Geordi LaForge: Captain, if we demodulate
the phase transducers we can quantify the venn diagram and beam you
out of there! Star Trek TNG S2Ep9
Slide 7
Websites Back to Basics A website is: A collection of files on
a computer (server) The server runs a program (web server, e.g.
Apache) The server runs continuously It waits for incoming
connections to its DNS address It returns one or more files
Possibly having run them through a PHP processor first And possibly
connecting to a database server Which is another continuously
running program 7 Most of us have desktop PCs at home. Can we use
these to run a website? Over to you
Slide 8
Using your home PC for a website Thoughts anyone? Good reasons:
Bad Reasons: 8
Slide 9
Using your home PC for a website My Thoughts Good reasons:
Cheap? Bad Reasons: Your PC has no DNS address! Your PC has to be
on all the time! Your PC OS is (probably) insecure And not
optimised as a server Your internet connection is Asymmetric (ADSL
line) I.e. much slower to send than receive Hard to scale &
manage 9
Slide 10
Most Websites are 3 rd Party Hosted Even quite large
organisations use 3 rd party hosts Hosting benefits hugely from
economies of scale A good web host will have available (at least):
Dual redundant connections to the electricity grid Multiple,
physically separate, connections to the internet backbone Battery
UPS for short term interruptions Diesel generators for longer
outages Big buckets of spare hard drives, fans, etc. 24 hour
on-site staff to monitor & fix things Secure access Regular
backups And a complete second, fall-back site with all of the above
as well! 10
Slide 11
What Do You Get From a Web Host? You can have (in order of
cost) Part of a shared server A virtual Linux Server A virtual
Windows Server Your own physical server Usually includes one domain
name Variations: Number of databases Quantity of disk space
Download bandwidth Further domain names 11 Example price: I pay 60
year for 10GB, 10 databases, unlimited bandwidth, 1 domain name
(+12 for a second)
Slide 12
How Do I Manage My Server? For file management (HTML, CSS files
etc.) Probably FTP or SFTP file transfer programs Possibly WEBDav
or similar remote mounted file system For more control and
information Management tools such as CPanel or Plesk Command line
access e.g. SSH (Cheap hosts might just give you access to some
Framework e.g. Wordpress.com just gives you a Wordpress Dashboard)
(More on this later) 12
Slide 13
Example FTP Manager 13
Slide 14
DEMONSTRATION OF CPANEL (Following slides are example
screenshots) 14
Slide 15
www.karlwilcox.com 15
Slide 16
CPanel Main Screen 16
Slide 17
The CPanel File Manager 17
Slide 18
The CPanel HTML Editor 18
Slide 19
Astounding Statistic! So we have seen how to upload and manage
HTML and CSS files on our hosted server Thats all we need right?
Wrong! Proportion of web pages in the real world created in an
editor by typing in HTML and CSS: Less than 1%!* 19 * Source:
Plucked out of thin air
Slide 20
Examples of Frameworks Most web content is created using
various Frameworks Wordpress: originally for blogs, but can manage
any content Joomla: general content management Moodle: Education
and virtual learning environments Mediawiki: Wikis (like Wikipedia)
Drupal + many others 20
Slide 21
What is a Framework? A set of (typically) PHP programs, HTML
and CSS fragments and a database of Content The HTML fragments are
usually things like the header and footer sections of each page
Formatted by CSS Content is extracted from the database as required
And the PHP program pulls it all together and serves the page All
managed by some sort of user friendly control panel or dashboard
Often have Themes or Skins to manage appearance 21
Slide 22
Framework Operation 22 HTML Header Fragment HTML Footer
Fragment Database of page contents CSS file PHP Program Request for
page (site.com/?page=23) Complete HTML Page
Slide 23
DEMONSTRATION OF WORDPRESS DASHBOARD (Following slides are
example screenshots) 23
How are Frameworks Created? Using PHP and Javascript (usually)
Typically with some sort of Integrated Development Environment
(IDE) Similar to other software development projects Often
collaborative, Open Source projects Money can be made by: Offering
support Creating and selling themes / skins Developing custom
add-ons and extensions 28
Slide 29
QUICK LOOK AT PHPSTORM (Time Permitting) 29
Slide 30
PHPStorm IDE by JetBrains 30
Slide 31
Thats All on Web Sites Dont worry if you dont understand any of
this Just be aware of it But try to remember what is what! At least
know what it is you dont know 31
Slide 32
Developing Android Applications You have seen one way to
develop Android Apps Probably not suitable for real-world
applications But the actual process is very similar Install the
Eclipse IDE (free) Install the Android Software Development Kit
(free) Set up your development environment Source control, testing,
backups etc. Learn to program in Java Read design guidelines, learn
Google Services & APIs Distribute by publishing the APK file Or
register with the Google Developer Console ($25pa) Sell through the
Google App Store (30% fee) 32
Slide 33
Eclipse and Android SDK 33
Slide 34
Developing iOS Apps Buy a Mac! Install Xcode (free with OS X)
Learn Objective C (not recommended) Or Learn Swift (recommended)
Read design guidelines, learn APIs etc. Set up your development
environment (see next slide) Join Apple Developer Program (79pa)
This is the only way to distribute Apps(!) Submit App to the Apple
Store (30% transaction fee) There is a validation & acceptance
process 34
Slide 35
Why Swift? Swift is Apples new development language Completely
new language design No one can claim 20+years experience of Swift!
Functionally rich, strongly typed, well supported But still subject
to change Last Friday, Swift 1.2 introduces a whole new datatype!
(set) And a special tool to update your code to the latest version
This kind of thing doesnt happen with Javascript or PHP! 35
Slide 36
My iOS App Dev Environment 36 MacBook Pro With XCode External
drive with Time Machine & Carbon Copy Backups Internal drive
(SSD) with working files + GIT repository Automatic copy to iCloud
Drive Each GIT version copied to Bitbucket iPhone for testing
Slide 37
Why so complicated? Time Machine (incremental backups) In case
of accidental file deletion or cat walking on the keyboard Carbon
Copy Cloner (full system image) In case of internal disk failure
iCloud Backup (working files and repository) In case of total loss
of MacBook and External Disk BitBucket GIT Clone In case of local
GIT problems Also allows for additional developers 37
Slide 38
DEMO OF XCODE (Example screenshots on the next few slides)
38
Slide 39
Xcode IDE Screen Builder 1 39
Slide 40
Xcode IDE Screen Builder 2 40
Slide 41
Xcode Code Editor 41
Slide 42
IOS Emulator & Debugging 42
Slide 43
LETS SUMMARISE (End of Demos) 43
Slide 44
Recall our Venn Diagram Stuff that actually goes on Stuff you
get taught Stuff you get tested on
Slide 45
Putting Some Figures on Things By %-age of expert status skills
(1) HTML 50% (the most common parts) CSS 20% Javascript 5% PHP 5%
Accessibility 60% Mobile Device Development 5% Software Development
Process 1% Version Control 30% 45 (1) For fun only. This is a
personal opinion based on you undertaking and understanding the
published course material and does not constitute a reference or
guarantee!
Slide 46
What Skills Do I Have? Website development and maintenance /
modification Understanding and modification of existing, simple
Javascript and PHP programs Partaking of simple roles in the
software development process (e.g. testing) Mobile application user
interface design (for simple apps) 46
Slide 47
What Can I Do With These Skills?* Create a static website from
scratch Make simple modifications to an existing, moderately
complex website (tweaking layouts etc.) Create and modify a simple
website using a framework, Test any website for accessibility
compliance User test any website or mobile application 47 *As
before, there are no guarantees here, just my personal opinion on
what you should be able to achieve if you have completed and
understood the bulk of the course material!
Slide 48
How Can I Improve My Skills? Build a website! (Based on
something you know about) Do a web search for free web hosting uk
Or see if you ISP offers free space Offer to create / update an
existing charity web site There are lots of these, often quite out
of date, especially with regard to accessibility Looks good on your
CV! See if you can get involved with any beta testing of web or
mobile applications Chose an area or application that you are
interested in or knowledgeable about 48
Slide 49
What Else Could I Look At? -1 Books Can be expensive & poor
value Check Amazon recommendations (read reviews, not just
ratings!) Second or third editions a reasonable sign of popularity
49
Slide 50
What Else Could I Look At? - 2 Websites W3C schools, lots of
material (already used in this course) Stack Overflow for specific
questions (search existing first!) Apple Developer Docs
(developer.apple.com) Android Developer Docs
(developer.android.com) 50
Slide 51
What Else Could I Look At? - 3 Magazines NET quite good for all
round web development Web Designer more for the arty types (visual
aspects) 51
Slide 52
Future OU Courses? Talk to Student Services: Possibilities
include: T325 Technologies for Digital Media T320 E-Business
Technologies M364 Fundamentals of Interaction Design Any others?
What are you thinking of doing next? Type below: 52 Stop Press! New
level 3 courses TM353 TM354
Slide 53
Thats All Folks A Reminder Deadline for EMA Midday 1 st June NO
EXTENSIONS! Any Questions? 53
