SnapDev
@generonquillo
Menu for today...
Website Development Process
Facebook Application Development Process
Servers 101
IT Terminologies
Web Design Trends 2014
Website Development Process
Mockups
Sitemap
Content Plan
Brainstorming
System Design
System Architecture
Flow Chart
Database Design
Data Repositories
Ledgers
Where to put the data
PSD mockups to Templates
HTML are like cement and steel
CSS are the paints
Javascript makes the doors and windows move
Takes a lot of TIME
Longer if Responsive Web Design
Browser Compatibility
Templates to PHP Programming
How the door lock works
How the toilet flushes
How everything works!
Where integration takes place
Wordpress, Magento, Facebook, Hydra
Testing
Performed by a QA Engineer
Test every functionality, layout, user experience
Page Load Optimization
Browser Tests
A/B Testing if applicable
Beta Testing
Migration
Server to Server
Domain Propagation
Another round of tests
Launch!
*Another round of tests
Facebook Application Development Process
Mockups
Check if we did this already...
Templating
Copy existing codes
Test and test facebook functionalities
If not...
Do the same process
Servers
What is a server?
Hosting Providers



Cloud Server
Lower setup costs
Easy to scale up
Pay what you need
No server maintenance or patches
Bandwidth
Traffic consumed by visitors
Images, videos, files, web pages
SMPFC Server consumes 50-70 GB
Facebook App Server 20-30 GB
Memory
Every pageload consumes approx 2MB of memory
Many concurrent visitors = needs more memory
SMPFC server has 4 GB of memory
Replenishes instantly
Backups
Daily database backups
Daily and/or weekly server backups
1 month retention
Security
Security Updates
Limited Access
FTP
Administrator
Terminologies
FTP
File Transfer Protocol
SLA
Service Level Agreement
Server Uptime
Server Availability
99.9%
8 hours of downtime per year
API
Application Programming Interface
Web API ; Server Side API
Useful for mobile applications
Google Maps API, Facebook Open Graph API
Questions?
Web Design Trends*
2014
*Predictions
Responsive Web Design
Design for mobile then scale up
Content for mobile
Lightweight
Cost effective
Single codebase
Flat
Simplicity
Color schemes
Simplified content
Reduce visual clutter
Jumbotron
Large Video Backgrounds
Large texts
Large Image Backgrounds
Blurred Imagery
Hero Areas
Parallax
Background stays behind
Texts / other elements move in different direction
Started 2012
One Page Design
One Page Scroll
Smooth scrolling
Thank You!
SnapDev
By Gene Ronquillo
SnapDev
- 332