{"id":15463032,"url":"https://github.com/sohamsshah/reactjs-meetup-14","last_synced_at":"2025-04-22T10:42:57.929Z","repository":{"id":104837003,"uuid":"384621826","full_name":"sohamsshah/reactjs-meetup-14","owner":"sohamsshah","description":"Reactjs Meetup 14 talk","archived":false,"fork":false,"pushed_at":"2021-07-11T09:09:43.000Z","size":188,"stargazers_count":7,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-22T10:42:53.062Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/sohamsshah.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-07-10T05:53:02.000Z","updated_at":"2023-08-27T16:10:23.000Z","dependencies_parsed_at":null,"dependency_job_id":"af30652a-4a65-49a9-86bd-0a57ee794742","html_url":"https://github.com/sohamsshah/reactjs-meetup-14","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sohamsshah%2Freactjs-meetup-14","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sohamsshah%2Freactjs-meetup-14/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sohamsshah%2Freactjs-meetup-14/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sohamsshah%2Freactjs-meetup-14/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/sohamsshah","download_url":"https://codeload.github.com/sohamsshah/reactjs-meetup-14/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250222301,"owners_count":21394850,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-02T00:06:42.863Z","updated_at":"2025-04-22T10:42:57.914Z","avatar_url":"https://github.com/sohamsshah.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"# [React Bangalore Meetup #14](https://www.meetup.com/ReactJS-Bangalore/events/278654306/?_xtd=gqFyqTI2NjU3MDgwNqFwp2FuZHJvaWQ\u0026from=ref) \n\nIn this talk, my primary focus was around how to build developer products such as libraries, open source projects, tools etc. Made an effort to explore and explain the process of developing a library (here, React Component Library) by understanding how it is done in popular open source projects and else where. Also, throughout the talk, along with tech explanation, there was a lot of live-code and eventually we publish our own **React Component Library** to NPM!\n\nThis repository contains the code used to demonstrate during the talk. I hope you find it useful :)\n\n### You can watch the the talk [here](https://youtu.be/QjzOjK0d4qE?t=3694) ;) \n\n---\n\n# Feel Free to leave a ⭐ if you find this useful\n\n## Resources 📚\n\n### 1. Design Systems 🎨\n\n**Must Refer Design Systems 🖌**\n\n* [Atlassian Design System](https://atlassian.design/)\n* [Carbon Design System](https://www.carbondesignsystem.com/)\n* [Material Design System](https://material.io/design)\n* [Lightning Design System](https://www.lightningdesignsystem.com/getting-started/)\n* [Polaris Design System](https://polaris.shopify.com/)\n\n**Blog References 🧾**\n\n* https://www.viget.com/articles/design-systems-why-now/\n* https://www.viget.com/articles/design-systems-problems-solutions/\n* https://uxplanet.org/design-systems-are-bullsh-t-7ecdb795cc62\n* https://www.smashingmagazine.com/2019/10/design-systems-relationships/\n* https://uxdesign.cc/design-systems-62f648c6dccf\n* https://xd.adobe.com/ideas/principles/design-systems/five-common-design-system-pain-points-how-to-solve-them/\n* https://www.invisionapp.com/inside-design/guide-to-design-systems/\n\n### 2. Storybook 📗\n\n**Concepts and Documentation References 📃**\n\n* [Install](https://storybook.js.org/docs/react/get-started/install)\n* [Args](https://storybook.js.org/docs/react/writing-stories/args)\n* [Parameters](https://storybook.js.org/docs/react/writing-stories/parameters)\n* [Naming and Component Hierarchy](https://storybook.js.org/docs/react/writing-stories/naming-components-and-hierarchy)\n* [MDX Docs](https://storybook.js.org/docs/react/writing-docs/mdx)\n* [Testing with Storybook](https://storybook.js.org/docs/react/workflows/testing-with-storybook)\n\n**Video Tutorial References 🎥**\n\n* [Codevolution](https://www.youtube.com/watch?v=BySFuXgG-ow)\n* [Design Systems and Storybook Course by Frontend Masters](https://frontendmasters.com/courses/design-systems/)\n\n### 3. Module Bundling and Rollup 🧮\n\n**Listing some of the best Blog References 📃**\n\n* https://medium.com/thron-tech/rollup-is-a-great-bundling-tool-but-is-it-the-one-you-should-use-cdb9ea175056\n* https://medium.com/webpack/webpack-and-rollup-the-same-but-different-a41ad427058c\n* https://www.danielberndt.net/2018/you-might-not-need-rollup-for-libraries/\n* https://developpaper.com/why-is-rollup-more-suitable-for-packaging-libraries-than-webpack/\n* https://www.thetechplatform.com/post/rollup-vs-parcel-vs-webpack-which-is-the-best-bundler\n\n**Video Tutorial References 🎥**\n\n* https://www.learnwithjason.dev/blog/learn-rollup-js\n* [JavaScript Module Bundling with Webpack and Rollup](https://www.youtube.com/watch?v=pDjUOQ8yL88)\n* [Let's Talk about Rollup - JS Monthly London - November 2017](https://www.youtube.com/watch?v=EU9j0IB-crA)\n* [Webpack 4 Fundamentals Course by Frontend masters](https://frontendmasters.com/courses/webpack-fundamentals/)\n* [Web Performance with Webpack Course by Frontend Masters](https://frontendmasters.com/courses/performance-webpack/)\n* [Webpack 5 end-to-end](https://www.youtube.com/watch?v=X1nxTjVDYdQ\u0026list=PLmZPx_9ZF_sB4orswXdpThGMX9ii2uP7Z)\n* [Yarn Workspaces](https://www.youtube.com/watch?v=G8KXFWftCg0)\n* [Lerna](https://www.youtube.com/watch?v=p6qoJ4apCjA)\n\n## You can find my Talk Presentation slides 🎞 [here](https://docs.google.com/presentation/d/1VOcL18u8rQ18i7U6LVso_SgSXZPyVFfeWea1ux49w-k/edit?usp=sharing)\n\n## Want to give a talk? 🗣 Here are few amazing places from where you can start from!\n* [React.js Bangalore](https://twitter.com/ReactBangalore)\n* [Reactify IN](https://twitter.com/reactify_in)\n* [Js Lovers](https://twitter.com/jslovers_del)\n* [GDG Bangalore](https://twitter.com/GDGBLR)\n* [JS Meetup BLR](https://twitter.com/jsmeetupblr)\n* [React Native BLR](https://twitter.com/ReactNativeBLR)\n* [Reason Bangalore](https://twitter.com/ReasonBangalore)\n* [GraphQL BLR](https://twitter.com/GraphQLBlr)\n* [BLR CSS](https://twitter.com/blrcss)\n\nFeel Free to raise a PR to add resources or anything you wanna share in general!\n\n### Thank you [@reactify_in](https://twitter.com/reactify_in) for having me! ♥\n\n\n\n\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsohamsshah%2Freactjs-meetup-14","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsohamsshah%2Freactjs-meetup-14","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsohamsshah%2Freactjs-meetup-14/lists"}