React 16 & NPM, Create your own library - React Delhi NCR 07 Oct 2018 Meetup

Transcript

1. 1.

   React 16 & NPM - Create your own library React

   Delhi/NCR
 @reactdelhincr
2. 2.

   bit.ly/react-delhincr

3. 3.

   Agenda • Understanding component driven architecture • Project intro with

   live coding session • Break / Networking • Project collaboration • Project deployment on NPM
4. 4.

   Component driven modular architecture Anoop Gupta
 @anoop__gupta

5. 5.

   Lets build something together! How about a React UI library?

6. 6.

   CSS Mint github.com/ArunMichaelDsouza/css-mint

7. 7.

   None
8. 8.

   Live coding session Zahin Alwa
 @zahinize Yomesh Gupta
 @yomeshgupta Tanvee

   Gujral
 @gujral_tanvee
9. 9.

   Lets collaborate!

10. 10.

    Understanding the GitHub flow guides.github.com/introduction/flow

11. 11.

    github.com/React-Delhi-NCR/yarul

12. 12.

    Project deployment on NPM Arun Michael Dsouza @amdsouza92

13. 13.

    > npm adduser docs.npmjs.com/cli/adduser

14. 14.

    > npm whoami docs.npmjs.com/cli/whoami

15. 15.

    docs.npmjs.com/files/package.json

16. 16.

    Semantic versioning semver.org

17. 17.

    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
18. 18.

    • Minor version : 0.1.0 • Patch version : 0.1.3

    • Major version : 1.1.3
19. 19.

    Open source licenses opensource.org/licenses

20. 20.

    MIT license opensource.org/licenses/MIT

21. 21.

    > npm init docs.npmjs.com/cli/init

22. 22.

    > git tag -a v0.1.0 -m “First minor release” git-scm.com/book/en/v2/Git-Basics-Tagging

23. 23.

    > npm publish docs.npmjs.com/cli/publish

24. 24.

    What about re-publishing? • Commit code changes • Create new

    tag and update package.json • Run npm publish again
25. 25.

    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
26. 26.

    Thank you! React Delhi/NCR
 @reactdelhincr AdPushup
 @adpushup