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
Modular JavaScript: FEL, Feb 2013
Search
Jack Franklin
February 28, 2013
Technology
0
88
Modular JavaScript: FEL, Feb 2013
Jack Franklin
February 28, 2013
Tweet
Share
More Decks by Jack Franklin
See All by Jack Franklin
Advanced React Meetup: Testing JavaScript
jackfranklin
1
210
Components on the Web: Frontend NE
jackfranklin
1
770
ReactiveConf: Lessons Migrating Complex Software
jackfranklin
0
430
Front Trends: Migrating complex software
jackfranklin
1
770
Migrating from Angular to React: Manc React
jackfranklin
1
150
Half Stack Fest: Webpack
jackfranklin
4
500
FullStackFest: Elm for JS Developers
jackfranklin
1
210
Codelicious: Intro to ES2015
jackfranklin
0
350
PolyConf: Elm for JS Developers
jackfranklin
0
250
Other Decks in Technology
See All in Technology
php-conference-nagoya-2025
fuwasegu
0
150
1行のコードから社会課題の解決へ: EMの探究、事業・技術・組織を紡ぐ実践知 / EM Conf 2025
9ma3r
11
3.8k
EDRの検知の仕組みと検知回避について
chayakonanaika
12
4.9k
Snowflake ML モデルを dbt データパイプラインに組み込む
estie
0
100
日経のデータベース事業とElasticsearch
hinatades
PRO
0
240
Two Blades, One Journey: Engineering While Managing
ohbarye
4
2k
IAMポリシーのAllow/Denyについて、改めて理解する
smt7174
2
210
RemoveだらけのPHPUnit 12に備えよう
cocoeyes02
0
290
株式会社Awarefy(アウェアファイ)会社説明資料 / Awarefy-Company-Deck
awarefy
3
11k
AI Agent時代なのでAWSのLLMs.txtが欲しい!
watany
2
230
OPENLOGI Company Profile for engineer
hr01
1
20k
サイト信頼性エンジニアリングとAmazon Web Services / SRE and AWS
ymotongpoo
7
1.6k
Featured
See All Featured
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Build your cross-platform service in a week with App Engine
jlugia
229
18k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Code Reviewing Like a Champion
maltzj
521
39k
Typedesign – Prime Four
hannesfritz
40
2.5k
How STYLIGHT went responsive
nonsquared
98
5.4k
4 Signs Your Business is Dying
shpigford
182
22k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
4
430
Thoughts on Productivity
jonyablonski
69
4.5k
Statistics for Hackers
jakevdp
797
220k
Optimizing for Happiness
mojombo
376
70k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
330
21k
Transcript
Modular JavaScript @Jack_Franklin
First: An Apology...
Who is this guy? Author of "Beginning jQuery" Blogger at
javascriptplayground.com Developer for Kainos (JS & Ruby) Comp-Sci student at University of Bath
Book Giveaway! Tweet your most cringe-worthy, clean joke with the
hashtag #feljoke I'll pick two winners once I'm done talking.
The era of web applications
What is Modular Development?
Separation of Concerns
One Module One Concern
Loose Coupling
modules don't know about each other modules are independent modules
don't talk to each other directly so they need some way of communicating
Publish and Subscribe
Modules have no knowledge of each other Modules publish events
Modules subscribe to events Loosely coupled, more maintainable modules don't publish events to specific other modules, but just do it generally
JS Patterns JavaScript is really good!
The Module Pattern var APP = (function() { var _count
= 0; var incrementCount = function() { _count++; } var getCount = function() { return _count; } return { incrementCount: incrementCount, getCount: getCount }; })(); _count is kept private can only be manipulated through incrementCount
RequireJS
RequireJS Implements the AMD Spec define() modules require() them No
more <script> tag rubbish Dynamic module loading Build tool
Package Managers
Package Managers JamJS Bower Component Volo nodefetch
GruntJS The JavaScript Task Runner
GruntJS Run tasks on your JS, including plugins for: -
Concatenating - Minifying - RequireJS Build Tool - Sass / LESS - CoffeeScript - Handlebars / Jade / templating - QUnit / Jasmine / Mocha / testing
Going Modular
- one step at a time - split your JS
up (in development) - use a tool (Grunt) for production JS - jQuery does Pub/Sub - initial hurdles outweighed by long-term gains
Questions? @Jack_Franklin javascriptplayground.com jackfranklin.co.uk github.com/jackfranklin