Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
React 16 & NPM, Create your own library - React...
Search
Arun Michael Dsouza
October 07, 2018
Programming
230
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
React 16 & NPM, Create your own library - React Delhi NCR 07 Oct 2018 Meetup
Arun Michael Dsouza
October 07, 2018
More Decks by Arun Michael Dsouza
See All by Arun Michael Dsouza
Using the Gamepad API for a Better Gaming Experience on the Web
arunmichaeldsouza
0
140
Using the Gamepad API for a better gaming experience on the web
arunmichaeldsouza
0
290
React JS Code Splitting - Why and How?
arunmichaeldsouza
1
280
Building your first web app with React JS, Webpack and Babel
arunmichaeldsouza
0
470
Houdini, what lies ahead - Web Weekend Kathmandu 2018
arunmichaeldsouza
0
220
Intro to React Components - React Delhi NCR 01 Jul 2018 Meetup
arunmichaeldsouza
1
750
Houdini, what lies ahead - JSConf Iceland 2018
arunmichaeldsouza
0
540
The Era of Module Bundlers - GDG Dev Fest Delhi 2017
arunmichaeldsouza
0
230
Getting started with React 16
arunmichaeldsouza
1
1.3k
Other Decks in Programming
See All in Programming
すこし踏み込む CancellationToken
htkym
2
1.6k
Streamlitで実現する自然言語データアプリ開発
ayumu_yamaguchi
1
340
速習iPhone Duo対応
yuukiw00w
2
960
Unity6 URPによる海底をテーマにしたVJシステムの解説 | Unity Shader 完全に理解した 勉強会
gam0022
0
320
KiroのSpecで「五目並べ」を作ってみる
satoshi256kbyte
1
350
Findy - エンジニア向け会社紹介/Findy Company Deck
findyinc
6
400k
R8 の設定見直しでアプリサイズ削減
andpad
0
130
半永久的に提供し続けられるプライベートクラウドを目指して ― 利用者の認知負荷を抑えるAPI抽象化とハードウェア世代交代の基盤設計
tomokon
0
430
JAWS-UG 東京支部が始める、JAWS-UG支部コラボ / JAWS-UG lunchtime LT Collaboration
y0hgi
0
180
IBM Bob Dojo #1 仕様駆動開発入門
oniak3ibm
PRO
0
340
MVNOの申込からeSIM開通までをiOSアプリでつなぐ- 本人確認・MNP・通信事業者基盤をまたぐ実装
satotakeshi
0
540
ゲームコントローラやキーボードのファームウェアをSwiftで書く
kishikawakatsumi
1
270
Featured
See All Featured
Designing Powerful Visuals for Engaging Learning
tmiket
1
590
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
230
23k
More Than Pixels: Becoming A User Experience Designer
marktimemedia
3
550
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
techseoconnect
PRO
0
450
Navigating the moral maze — ethical principles for Al-driven product design
skipperchong
2
600
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.9k
It's Worth the Effort
3n
188
29k
Stop Working from a Prison Cell
hatefulcrawdad
274
21k
16th Malabo Montpellier Forum Presentation
akademiya2063
PRO
0
390
Leveraging Curiosity to Care for An Aging Population
cassininazir
1
520
Statistics for Hackers
jakevdp
799
230k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Transcript
React 16 & NPM - Create your own library React
Delhi/NCR @reactdelhincr
bit.ly/react-delhincr
Agenda • Understanding component driven architecture • Project intro with
live coding session • Break / Networking • Project collaboration • Project deployment on NPM
Component driven modular architecture Anoop Gupta @anoop__gupta
Lets build something together! How about a React UI library?
CSS Mint github.com/ArunMichaelDsouza/css-mint
None
Live coding session Zahin Alwa @zahinize Yomesh Gupta @yomeshgupta Tanvee
Gujral @gujral_tanvee
Lets collaborate!
Understanding the GitHub flow guides.github.com/introduction/flow
github.com/React-Delhi-NCR/yarul
Project deployment on NPM Arun Michael Dsouza @amdsouza92
> npm adduser docs.npmjs.com/cli/adduser
> npm whoami docs.npmjs.com/cli/whoami
docs.npmjs.com/files/package.json
Semantic versioning semver.org
Given a version number MAJOR.MINOR.PATCH, increment the: • MAJOR version
when you make incompatible API changes • MINOR version when you add functionality in a backwards-compatible manner • PATCH version when you make backwards-compatible bug fixes
• Minor version : 0.1.0 • Patch version : 0.1.3
• Major version : 1.1.3
Open source licenses opensource.org/licenses
MIT license opensource.org/licenses/MIT
> npm init docs.npmjs.com/cli/init
> git tag -a v0.1.0 -m “First minor release” git-scm.com/book/en/v2/Git-Basics-Tagging
> npm publish docs.npmjs.com/cli/publish
What about re-publishing? • Commit code changes • Create new
tag and update package.json • Run npm publish again
Few things to keep in mind while designing your library
• Write a simple to use API • Limit the number of dependencies • Write tests and deploy a CI service
Thank you! React Delhi/NCR @reactdelhincr AdPushup @adpushup