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
Meteor Talk: Building Mitter
Search
Siddharth Kothari
January 31, 2016
Technology
1
99
Meteor Talk: Building Mitter
Building a Twitter-like search with Meteor and Appbase
Siddharth Kothari
January 31, 2016
Tweet
Share
More Decks by Siddharth Kothari
See All by Siddharth Kothari
Data Streams with Elasticsearch
siddharthlatest
0
130
Appbase.io - Customer Deck
siddharthlatest
0
140
Appbase.io - Investor Deck
siddharthlatest
0
330
Data Streams on ElasticSearch
siddharthlatest
0
160
Building a streaming database service
siddharthlatest
1
220
Appbase - A realtime events-based document store
siddharthlatest
1
810
Scalability Best Practices
siddharthlatest
0
180
Other Decks in Technology
See All in Technology
CDK CLIで使ってたあの機能、CDK Toolkit Libraryではどうやるの?
smt7174
4
120
Django's GeneratedField by example - DjangoCon US 2025
pauloxnet
0
120
スマートファクトリーの第一歩 〜AWSマネージドサービスで 実現する予知保全と生成AI活用まで
ganota
1
210
初めてAWSを使うときのセキュリティ覚書〜初心者支部編〜
cmusudakeisuke
1
240
下手な強制、ダメ!絶対! 「ガードレール」を「檻」にさせない"ガバナンス"の取り方とは?
tsukaman
2
420
20250903_1つのAWSアカウントに複数システムがある環境におけるアクセス制御をABACで実現.pdf
yhana
3
540
ハードウェアとソフトウェアをつなぐ全てを内製している企業の E2E テストの作り方 / How to create E2E tests for a company that builds everything connecting hardware and software in-house
bitkey
PRO
1
120
開発者を支える Internal Developer Portal のイマとコレカラ / To-day and To-morrow of Internal Developer Portals: Supporting Developers
aoto
PRO
1
440
Function Body Macros で、SwiftUI の View に Accessibility Identifier を自動付与する/Function Body Macros: Autogenerate accessibility identifiers for SwiftUI Views
miichan
2
180
エラーとアクセシビリティ
schktjm
1
1.2k
KotlinConf 2025_イベントレポート
sony
1
120
なぜSaaSがMCPサーバーをサービス提供するのか?
sansantech
PRO
8
2.8k
Featured
See All Featured
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
8
520
VelocityConf: Rendering Performance Case Studies
addyosmani
332
24k
Visualization
eitanlees
148
16k
Why Our Code Smells
bkeepers
PRO
339
57k
Reflections from 52 weeks, 52 projects
jeffersonlam
352
21k
Faster Mobile Websites
deanohume
309
31k
A better future with KSS
kneath
239
17k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
The Straight Up "How To Draw Better" Workshop
denniskardys
236
140k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
Building a Modern Day E-commerce SEO Strategy
aleyda
43
7.6k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
580
Transcript
Building a Twitter-like Search with Meteor and Appbase Siddharth Kothari
(@siddharthlatest)
Siddarth, sith in making Co-founder and CEO, appbase.io Give me
a shout at @siddharthlatest GET /programming/stacktrace [“Games”, “C”, “Python”, “Java (sigh)”, “AI”, “JS”, “Databases”]
What is Meteor
Hands-on Demo $ curl https://install.meteor.com/ | sh Install Meteor Step
0
Hands-on Demo $ meteor create <app_name> $ cd <app_name> Create
App Step 0 $ meteor
Hands-on Demo $ meteor add appbaseio:appbase $ meteor add manuel:reactivearray
Install Packages $ meteor add mizzao:bootstrap-3 Step 0
Appbase.io JS Library for building realtime feeds and search. Step
1 Create an app from the dashboard
Hands-on Demo var appbaseRef = new Appbase({ url: "https://scalr.api.appbase.io/", username:
"UaV93rU9p", password: "28bf943d-42f2-4861-a751-31d17b49c184", appname: "mitter" }) Step 1 <app_name>.js
Hands-on Demo if (Meteor.isClient) { /* things we do once
*/ var renderedTweets = new ReactiveArray(); var requestObject = {...}; ... Step 1 <app_name>.js
Hands-on Demo <app_name>.js appbaseRef.search(requestObject) .on('data', function(result) { renderedTweets = result.hits.hits
appbaseRef.searchStream(requestObject) .on('data', function(stream) { renderedTweets.push(stream._source) }) } Step 1
Hands-on Demo <app_name>.js /* define all the template helpers */
Template.body.helpers({ tweets: function() { return renderedTweets.list(); } }) Step 1
Step 1
Hands-on Demo $ git remote add origin https://github.com/appbaseio/mitter Get Mitter
Step 1 $ rm -rf * && git fetch $ git checkout tags/step1 -b step1
Hands-on Demo $ meteor deploy flyingkittens Deploy App Step 1
Your app should be live at http://flyingkittens.meteor.com.
Hands-on Demo $ meteor add mrt:twit Get a Twitter Dev
Account Step 2 Go to https://apps.twitter.com
Hands-on Demo { "consumer": { "key": ". . .", "secret":
". . ." }, "access_token": { "key": ". . .", "secret": ". . ." } } Private Files (for secure data) Step 2
Hands-on Demo if (Meteor.isServer) { Meteor.startup(function() { // code to
run on server at startup var conf = JSON.parse(Assets.getText('twitter.json')); … Server side Code Step 2
Step 2
Hands-on Demo Get Mitter#step2 Step 2 $ git checkout tags/step2
-b step2
Hands-on Demo <template name="search_box"> <input class="searchBox" type = "text" placeholder="Search
the tweets" autofocus="autofocus"/> </template> Adding Search Step 3
Hands-on Demo Template.search_box.events({ 'keyup input, click input': function(e, template) {
… Detect Key Inputs Step 3
Step 3
Hands-on Demo Get Mitter#step3 Step 2 $ git checkout tags/step3
-b step3
Building a Twitter-like Search with Meteor and Appbase Thank You!
@siddharthlatest