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
780
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
260
Other Decks in Technology
See All in Technology
JAWS FESTA 2024「バスロケ」GPS×サーバーレスの開発と運用の舞台裏/jawsfesta2024-bus-gps-serverless
ma2shita
3
290
【5分でわかる】セーフィー エンジニア向け会社紹介
safie_recruit
0
19k
Amazon Q Developerの無料利用枠を使い倒してHello worldを表示させよう!
nrinetcom
PRO
2
120
Snowflakeの開発・運用コストをApache Icebergで効率化しよう!~機能と活用例のご紹介~
sagara
1
510
20250304_赤煉瓦倉庫_DeepSeek_Deep_Dive
hiouchiy
2
110
実は強い 非ViTな画像認識モデル
tattaka
3
1.4k
Охота на косуль у древних
ashapiro
0
120
株式会社Awarefy(アウェアファイ)会社説明資料 / Awarefy-Company-Deck
awarefy
3
11k
AIエージェント開発のノウハウと課題
pharma_x_tech
8
4.4k
JavaにおけるNull非許容性
skrb
2
2.7k
データベースの負荷を紐解く/untangle-the-database-load
emiki
2
540
AWS Well-Architected Frameworkで学ぶAmazon ECSのセキュリティ対策
umekou
2
150
Featured
See All Featured
Code Review Best Practice
trishagee
67
18k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
30
2.2k
Facilitating Awesome Meetings
lara
53
6.3k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
How to train your dragon (web standard)
notwaldorf
91
5.9k
GraphQLとの向き合い方2022年版
quramy
44
14k
[RailsConf 2023] Rails as a piece of cake
palkan
53
5.3k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
33
2.1k
The MySQL Ecosystem @ GitHub 2015
samlambert
250
12k
Automating Front-end Workflow
addyosmani
1369
200k
Music & Morning Musume
bryan
46
6.4k
The Language of Interfaces
destraynor
156
24k
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