React Advanced

React Advanced 2022

Hello my friend, in this talk, I wanna share with you how to build your own open source project. Building an open source software project can be challenging. I receive a lot of things randomly in a day, like thank you messages for making my life easier, which motivates me. To choose an open source project to work on, pick one you use every day. Your software is being used when people report issues and send pull requests.

We all used open source projects every day such as npm packages, editors, web applications, and even operating systems... Have you ever thought of building one of your own? In this talk, I will share my journey building jest-preview, from when it was just a vague idea, to currently a well-adopted library to help frontend engineers write tests faster. I will share with you how to come up with an idea for a project to work on, what is the struggles you have to overcome as an author of an open source project, how to manage time efficiently, and how you get attention from engineers around the world.

How to Build Your Own Open Source Project

Hung Nguyen

React Summit

React Summit 2024

Open source projects can be successful by finding a large intersection of target users. Making extensions universal can lead to increased popularity and collaboration. Collaboration across ecosystems is encouraged to create more maintainable and extendable architectures. Financial support is necessary for open source projects to be sustainable. Contributing to open source can be done by identifying areas for improvement and actively participating in GitHub workflows.

Lessons I learned on my journey to working full time on open source, as well as tips for thinking and making open source projects more successful.

Anthony's Roads to Open Source - The Set Theory

Anthony Fu

Node Congress

Node Congress 2024

The talk explores the dark side of open source, focusing on supply chain attacks and the need for improved security measures. It highlights the dangers of loading external code and the importance of mitigating supply chain risks. The talk also discusses the use of AI and LLMs in code analysis to enhance security. It emphasizes the challenges of sustaining IC maintained open source projects and the future of supply chain security. Lastly, it touches on the variations in open source definitions and the empowerment of the open source community.

Join Feross, CEO of Socket, on a thrilling journey into the dark side of open source software. Come along for the ride as we explore the unseen risks lurking within everyday software dependencies. See firsthand how AI-driven solutions, specifically large language models, are helping us battle against malicious dependencies within the npm ecosystem. Arm yourself with the knowledge and tools to protect your codebase in this ever-evolving battle.

The Dark Side of Open Source

Feross Aboukhadijeh

The OpenJS Foundation supports the entire JavaScript ecosystem and thousands of open source projects. They follow a neutral nonprofit organization with separate business and technical governance to minimize drama. Rebooting governance and addressing intellectual property can also help reduce conflicts. OpenJS provides collaboration spaces and support in various areas for open source projects. They foster a collaborative environment and invite participation in their projects.

The stability and security of open source projects can be found in the people shaping the culture as much as the code they write. The Executive Director of the OpenJS Foundation will share lessons she learned along the way on how to build trust and transparency to minimize drama and overcome challenges in the JavaScript ecosystem. She will cover critical topics such as empowering projects with open governance, building an ecosystem around a community project, and how OpenJS supports essential projects such as Node.js.

Peace, Love and JavaScript

Robin Ginn

DevOps.js

DevOps.js Conf 2024

Jamal Sinclair-O'Garro introduces himself as a senior software engineer at Netflix with experience in algorithmic and electronic trading. Spinnaker is a multi-platform continuous delivery platform used by companies like Grubhub, Airbnb, Google, Netflix, Chime, Box, and Target. It provides infrastructure management and deployment through pipelines, allowing gradual rollouts and canary analysis to ensure safe changes. Spinnaker improves velocity and is recommended for streamlining JavaScript applications across different providers.

Spinnaker is an open-source continuous delivery platform that provides application management and deployment to help engineering teams confidently release software changes at a high velocity. It was initially developed at Netflix and is now used by many large-scale engineering teams. In this talk, we will explore how we can leverage it to deploy JavaScript applications to multiple cloud providers in a repeatable and scalable fashion while taking advantage of its robust feature set.

Spinnaker as a Continuous Delivery Solution for JavaScript Apps

Jamal Sinclair O'Garro

React Day Berlin

React Day Berlin 2023

Race conditions can be complex to debug and reproduce, causing frustration for users. The speaker discusses examples of race conditions and ways to fix and avoid them. They demonstrate an example of an auto-completion field in React and how to handle race conditions in API calls. The speaker introduces the FastCheck framework for property-based testing to address race conditions and improve tests. Randomizing inputs and outputs can help uncover bugs specific to certain scenarios. The speaker also discusses mitigating race conditions in React and handling test overhead and reproducibility.

Race conditions are among some of the most challenging to detect and reproduce issues. As such they pose a significant challenge in development notably in UI. In this talk, we explore how to detect race conditions by leveraging fuzzing techniques. We walk you through discovering the real problem of race conditions and how they impact user experience. We provide you tools and examples demonstrating how to easily detect them in your daily work thanks to tests relying on fuzzing. After that talk, we hope your React code will be race conditions free or at least that you will have the right tools to help you.

Break the Race: Easy Race Condition Detection for React

Nicolas Dubien

React Summit US

React Summit US 2023

Hey, everyone. Today, I want to talk about how anyone, even junior developers, can be an open-source maintainer. Let me share my journey of learning to code and becoming a maintainer. I made a website for an internal conference straight from code and made it open source. Participating in Hacktoberfest helped me connect with other developers and learn from them. Becoming an open-source maintainer increases your confidence, helps you make connections, and enables you to share cool tools with the world.

You don't have to be a senior React developer to create a project and open source it! I'll show you how I built an event website with React and EUI, then shared it with the world for contributions and mentored folks who helped improve it.

Anyone Can Be an Open Source Maintainer

Brittany Joiner

React Advanced 2023

Open Source promotes accessibility, inclusivity, collaboration, innovation, transparency, and trust. Code reviews are a collaborative process in software development, with challenges including language barriers, documentation changes, and review backlog. Best practices for effective code reviews include clear objectives, focusing on the code, and using code review tools. Linters are important for scanning code issues, and measuring success in code reviews can be done using key metrics. React Code Reviews are crucial for the success of open-source projects.

In this lightning talk, we will explore the significance of code reviews in open source projects, specifically within the React ecosystem. We'll discuss the benefits of code reviews for maintaining code quality, encouraging collaboration, and upholding project standards. By emphasizing effective feedback, respectful communication, and the use of relevant tools, participants will gain practical insights on conductingimpactful React code reviews. Join me to learn how code reviews can enhance the development process, encourage knowledge sharing, and contribute to the success of open source projects in the React community.

React Code Reviews in Open Source: Ensuring Quality and Collaboration

Patrick Odey

This talk provides tips for selecting the right open-source library, such as using NPM trends to compare libraries and considering bundle size, dependencies, and licenses. It also emphasizes the importance of choosing libraries maintained by multiple maintainers and being cautious when trusting engineers. The talk highlights a cautionary tale about relying on a single maintainer and suggests paying attention to changes in major versions and specifying exact versions in dependencies to mitigate security vulnerabilities.

As software developers, we often use open-source libraries. In this talk, I will share a few tips on selecting an open-source library and what to pay attention to when working with open-source libraries.

Is It the One? (How to Select an Open-Source Library?)

Keren Kenzi

Panel Discussion: Open Source & “Perceived Competition” Between Projects

Michel Weststrate

Mark Erikson

Alessia Bellisario

Fredrik Höglund

Dan Abramov

JS GameDev Summit

JS GameDev Summit 2023

Chris McCormick, an independent software developer, discusses his latest game Rogl, a minimalist online roguelike game. He shares the story of how Rogl gained popularity and emphasizes the importance of marketing and giving your creations a chance. McCormick highlights the value of frugality and underengineering, as well as the power of finding the best tech for efficiency. He explains why ClojureScript is the best tech for him and discusses deployment strategies using Piku. Overall, the talk emphasizes the importance of informing people about your project, prioritizing fast development, and user feedback.

Rogule is an emoji based open source online roguelike game that started life as a 7DRL game jam entry. It has now grown to around 1,500 games per day. In this talk I'll cover the weird tech (ClojureScript), the motivation, game mechanics, and the future of Rogule.

Rogule: Tales From the Dungeon of a Web Based Rogulelike

Chris McCormick

Today's Talk is about building team thinking games at Synthesis, an enrichment program aiming to build a generation of super collaborators. The key insight is that design is the main constraint, not graphics or AI. Synthesis uses open-source software and develops its own tools for game design and networking. The architecture of Synthesis games involves a server-native approach and a client-authoritative model for movement. The modular approach allows for quick iteration and flexibility in game development, and investing in content pipeline tools enables the creation of fresh content every week.

Synthesis' mission is to create a generation of supercollaborators through games. Learn how we harness the power of open source game dev libraries like Pixi.js and Colyseus to build high quality multiplayer games that kids enjoy.

Building Team Thinking Games  At Synthesis

Vivek Vidyasagaran

JS Nation

JSNation 2023

The Talk discusses building and supporting the JavaScript community, the role of companies in open source, the importance of time and collaboration, reporting bugs with kindness, the challenges of developer relations, the role of maintainers and documentation, the importance of inclusivity, embracing change in project development, supporting ourselves and the community, and finding hope for a better community.

Open source has won, and it's the center of gravity for our community. Whether we're contributors to open source projects, commercial product engineers, companies, developer advocates, or something else, we're all a part of this community. And we owe it to each other, and to ourselves, to leave the community better than we found it. But how do we do that? What responsibilities do companies have to the community? Or developer advocates? Or OSS contributors? How are we failing those responsibilities, and how can we do better? In short, what do we owe to each other? Let's find out.

What We Owe to Each Other

Bryan Hughes

Vue.js Live Conference

Vue.js London 2023

Nuxt.js modules are a central part of Nuxt and have had 14 million downloads. Creating Nuxt modules is easy with Nuxt 3. Modules can provide assets, CSS injection, plugins, and auto imports. Learning Nuxt modules gives a deeper understanding of Nuxt and extends its functionalities. The Nuxt community is friendly to newcomers and encourages module creation.

Nuxt modules are the de-facto way of extending our Nuxt applications with new behaviors and functionalities. Have you ever built your own? Why would you bother with hundreds of modules already out there? Let's answer those questions together and see why making your own modules in Nuxt 3 can both help you have a deeper understanding of how Nuxt works while also paving the way for you to get into open source!

Nuxt 3 Modules and Open-Source

Lucie Haberer

Node Congress 2023

Today's workshop covers the Node.js project, governance model, collaboration, and contribution. The Node.js organization has important repositories and follows a governance model for proposing changes. Collaboration involves bug reporting, pull requests, and detailed contribution guides. Strategic initiatives aim to improve Node.js, and the website redesign initiative faced challenges. The workshop focuses on technologies like React, Next.js, Jest, and Storybook, and provides hands-on experience and collaboration. Participants can work on various issues, including component migration and testing, and contribute to the Node.js project.

This workshop aims to give you an introductory module on the general aspects of Open Source. Follow Claudio Wunder from the OpenJS Foundation to guide you on how the governance model of Node.js work, how high-level decisions are made, and how to land your very first contribution. At the end of the workshop, you'll have a general understanding of all the kinds of work that the Node.js project does (From Bug triage to deciding the Next-10 years of Node.js) and how you can be part of the bigger picture of the JavaScript ecosystem. The following technologies and soft skills might be needed):   - Basic understanding of Git &amp; GitHub interface   - Professional/Intermediate English knowledge for communication and for allowing you to contribute to the Node.js org (As all contributions require communication within GitHub Issues/PRs)   - The workshop requires you to have a computer (Otherwise, it becomes difficult to collaborate, but tablets are also OK) with an IDE setup, and we recommend <a href="https://code.visualstudio.com/download" target="_blank">VS Code</a> and we recommend the <a href="https://marketplace.visualstudio.com/items?itemName=GitHub.vscode-pull-request-github" target="_blank">GitHub Pull Requests &amp; Issues</a> Extension for collaborating with Issues and Pull Requests straight from the IDE. The following themes will be covered during the workshop: - A recap of some of GitHub UI features, such as GitHub projects and GitHub Issues - We will cover the basics of Open Source and go through Open Source Guide - We will recap Markdown - We will cover Open Source governance and how the Node.js project works and talk about the OpenJS Foundation   - Including all the ways one might contribute to the Node.js project and how their contributions can be valued - During this Workshop, we will cover Issues from the nodejs/nodejs.dev as most of them are entry-level and do not require C++ or deep technical knowledge of Node.js.   - Having that said, we still recommend enthusiast attendees that want to challenge themselves to "Good First Issues" from the nodejs/node (core repository) if they wish.   - We're going to allow each attendee to choose an issue or to sit together with other attendees and tackle issues together with Pair Programming through VS Code Live Share feature     - We can also do Zoom breakrooms for people that want to collaborate together   - Claudio will be there to give support to all attendees and, of course, answer any questions regarding Issues and technical challenges they might face   - The technologies used within nodejs/nodejs.dev are React/JSX, Markdown, MDX and Gatsby. (No need any knowledge of Gatsby, as most of the issues are platform agnostic) - By the end of the Workshop, we'll collect all (make a list) the contributors who successfully opened a Pull Request (even if it's a draft) and recognise their participation on Social media.

Node.js: Landing your first Open Source contribution & how the Node.js project works

 Claudio Wunder

React Day Berlin 2022

The Talk discusses how an open source library, ReactFlow, was made financially sustainable. Various methods were tried, including Github sponsoring and cross financing, but a price tag was eventually added to the library. Building trust and clear expectations through ongoing support and communication with subscribers was key to gaining financial support. The issue of people not knowing how much to contribute was addressed by providing a clear pricing structure. Additional features like one-on-one support and Pro examples were added to combat the paradox of choice and encourage financial support.

React Flow is an open source library used by thousands of developers and hundreds of companies. How do we make sure it stays alive, and also free? I’ll share some insights along our journey from open sourcing React Flow to passing the “black zero,” including findings from our user research where we spoke to some of the people who support us every month.

Making an Open Source Library Financially Sustainable

John Robb

TS Congress

TypeScript Congress 2022

Mark Erickson, a Senior Frontend Engineer at Replay, discusses JavaScript libraries and their support for TypeScript, including migration, versioning, and debugging. He also explores the challenges of supporting multiple TypeScript versions and designing APIs for use with TypeScript. Additionally, he shares advanced Redux type tricks and insights into maintaining a TypeScript library. The poll results reveal the widespread usage of TypeScript among developers, with many gradually migrating their codebases. Lastly, he provides tips for upgrading TypeScript and verifying functionality.

Maintaining widely-used JS libraries is already complicated, and TypeScript adds an additional set of challenges. Join Redux maintainer Mark Erikson for a look at some of the unique problems TS library maintainers face, and how the Redux team has handled those problems. We'll cover: - Tradeoffs of different ways to define TS types for a library - How to target different versions of TS, and considerations for determining the supported version range - Migrating existing JS libraries to TS - Differences between writing "app" types and "library" types - Managing and versioning public types APIs - Tips and tricks used by types from the Redux libraries - TS limitations and possible language-level improvements

Lessons from Maintaining TypeScript Libraries

React Finland

React Finland 2021

Over the past few years, state machines, statecharts, and the actor model have proven to be viable concepts for building complex application logic in a clear, visual way with XState. In this talk, we'll take a peek into the future of XState, including new features in the next version, and new tools and services that will make it even easier to create and collaborate on state machines. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

#open-source