Publish Your React Component
42
Publish Your React Component Share your code, Build your repo Mark Muskardin - hackingbeauty.com September 22, 2016 - San Francisco ReactJS
-
Upload
mark-maximus-muskardin -
Category
Software
-
view
77 -
download
0
Transcript of Publish Your React Component
Publish Your React Component
Share your code, Build your repo
Mark Muskardin - hackingbeauty.comSeptember 22, 2016 - San Francisco ReactJS
2
I’m a UI Engineer(Single Page Apps with React/Redux)
3
Web Apps are evolving…
Source: developers.google.com/web/progressive-web-apps
4
JavaScript is evolving too…
Yesterday Today
(You should be writing in ES6 now)
5
We have an awesome publishing system
6
Developers have a lot of problems…
7
Disjointed Codebases
Mobile Web Desktop Web IOS Android
Many companies don’t just have 1 app
App 1 App 2 App 3 App 4 App 5
9
Company UI Library
10
(saves time and money)
* Reusability is key *
11
Today, we do things differently
DEVELOP IN COMPONENTS
Why publish your own component?
YOU are an evolving developer.
13
1. You learn key engineering principles
14
“Write programs that do one thing and do it well.
Write programs to work together.”
- The Unix Philosophy
15
2. Helps build your portfolio
16
3. It’s really easy & you get to share
18
19
I want to let you in on a little secret…
20
You don’t have to build everything from scratch
21
REMEMBER“Write programs that do one thing and do it well.
Write programs to work together.”
22
For example…
Write something simple
For example…
23
24
Material-UI Components
25
Material-UI Autocomplete
26
material-ui-youtube-autocomplete 1.2.1
27
< 100 lines of codehackingbeauty.com/create-a-reactjs-component-part1
28
How do I start?
29
#1 - Figure out what to build, then build it(Keep it small and focused)
31
#2 - Write good documentation
32
A solid README.md on Github
Show usage and an example!
33
#3 - Build a demo (critical for UI components)
34
Free on Github Pages
35
#4 - Tell people
37
Write a short blog post
38
Make your life easier…
39
My favorite tool: NWB
40
* CLI for bootstrapping components/libraries
* Builds the demo page for you!!!
* Dev tools, testing, production builds, configuration
NWB (github.com/insin/nwb)
41
React-specific tips on reusability
There’s more to know…
CSS management
Testing
