Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
How to Build a Single Page Web by Bootstrap, a...
Search
andre
July 07, 2014
Programming
2
550
How to Build a Single Page Web by Bootstrap, and Github, Google Docs, Parse.
Using Web Services to build a single page web for free in beginning phrase.
andre
July 07, 2014
Tweet
Share
More Decks by andre
See All by andre
Booking.com Hackathon Taipei 2017
andre
0
200
Auto I18N (Internationalization) Process
andre
0
68
Write Securer Code
andre
0
61
iPatrol
andre
0
58
Hello SDN
andre
0
120
koa introduction (Node.js Web Framework)
andre
3
380
RxJS (The Reactive Extensions for JavaScript ) Introduction
andre
4
370
JSDC 2014 Taiwan Lightning Talk: TBD
andre
0
130
From Facebook Graph API 1.0 to 2.1
andre
0
240
Other Decks in Programming
See All in Programming
TokyoR116_BeginnersSession1_環境構築
kotatyamtema
0
110
第3回 Snowflake 中部ユーザ会- dbt × Snowflake ハンズオン
hoto17296
4
360
ファインディの テックブログ爆誕までの軌跡
starfish719
2
1.1k
2,500万ユーザーを支えるSREチームの6年間のスクラムのカイゼン
honmarkhunt
6
5.1k
ISUCON14公式反省会LT: 社内ISUCONの話
astj
PRO
0
180
Spring gRPC について / About Spring gRPC
mackey0225
0
220
いりゃあせ、PHPカンファレンス名古屋2025 / Welcome to PHP Conference Nagoya 2025
ttskch
1
270
Java Webフレームワークの現状 / java web framework at burikaigi
kishida
9
2.2k
SRE、開発、QAが協業して挑んだリリースプロセス改革@SRE Kaigi 2025
nealle
3
4.1k
iOSエンジニアから始める visionOS アプリ開発
nao_randd
3
120
DROBEの生成AI活用事例 with AWS
ippey
0
130
chibiccをCILに移植した結果 (NGK2025S版)
kekyo
PRO
0
210
Featured
See All Featured
Designing for humans not robots
tammielis
250
25k
GitHub's CSS Performance
jonrohan
1030
460k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
29
4.6k
Code Reviewing Like a Champion
maltzj
521
39k
The Invisible Side of Design
smashingmag
299
50k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
29k
A Modern Web Designer's Workflow
chriscoyier
693
190k
Java REST API Framework Comparison - PWX 2021
mraible
28
8.4k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
44
7k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
29
2.2k
Site-Speed That Sticks
csswizardry
3
370
Transcript
How to Build a Single Page Web by Bootstrap, Github,
Google Docs, and Parse. Andre Lee
Outline • Single Page • Pros and Cons • Sketch
• Github Pages • Google Docs • Demo
Outline • Single Page • Pros and Cons • Sketch
• Github Pages • Google Docs • Demo
Single Page • Single-Page Application (SPA) or • Single-Page Interface
(SPI) Client Side Routing Client Side Rendering SPA
Outline • Single Page • Pros and Cons • Sketch
• Github Pages • Google Docs • Demo
Pros and Cons Pros • Reduce Rendering Duplicate Objects •
Date & Time • Keep User’s State • Responsive
Pros and Cons (Cont’d) Cons • Need JavaScript to be
Enabled • Search Engine Optimization • Browser History
Outline • Single Page • Pros and Cons • Sketch
• Github Pages • Google Docs • Demo
Sketch • Bootstrap • Font Awesome • AngularJS
Outline • Single Page • Pros and Cons • Sketch
• Github Pages • Google Docs • Demo
Github Pages Pros • Free • Custom Domain Name •
Don’t worry about DDoS Cons • All Public
Github Pages
Github Pages (Cont’d) Demo • Github • git branch gh-pages
• Domain Name
Outline • Single Page • Pros and Cons • Sketch
• Github Pages • Google Docs • Demo
Google Docs Pros • Free Cons • Need to be
Hacked • One Page Limitation
Outline • Single Page • Pros and Cons • Sketch
• Github Pages • Google Docs • Demo • Single Page • Pros and Cons • Sketch • Github Pages • Google Docs • Parse • Demo
Parse • Free for getting started • Infra. APIs •
Push Notifications • Analytics • All need to do is “Business Logic”
Parse (Cont’d) • Parse.com • JavaScript SDK • Backbone-style •
CRUD
Outline • Single Page • Pros and Cons • Sketch
• Github Pages • Google Docs • Parse • Demo
Code • http://lab.andretw.com/spa • https://gist.github. com/andretw/0253c8b43e21165c4cd3
Demo
Thank you