eslint-plugin-react
React
eslint-plugin-react | React | |
---|---|---|
67 | 1,696 | |
8,821 | 222,111 | |
0.3% | 0.5% | |
8.4 | 9.9 | |
4 days ago | about 20 hours ago | |
JavaScript | JavaScript | |
MIT License | MIT License |
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
eslint-plugin-react
-
Interesting Bugs Caught by ESLint's no-constant-binary-expression
> [1] https://github.com/jsx-eslint/eslint-plugin-react/blob/maste...
From what I remember, being able to pass children as a prop is considered a side-effect of an implementation detail, that breaks the expected abstraction. There really isn't any reason to use it, and I think there's a chance it may even confuse the virtual dom diffing?
Also this would prevent you from accidentally doing both at once:
Is it me?}>
-
Speeding up the JavaScript ecosystem – Polyfills gone rogue
I try to focus on the issues rather than individuals, but the root of the problems in the listed eslint plugin libraries points to ljharb.
If you do some simple digging into these libraries, you will find that these types of commits are quite common within them.
https://github.com/jsx-eslint/eslint-plugin-react/commit/e1d...
https://github.com/jsx-eslint/jsx-ast-utils/commit/bad51d062...
https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/commit/...
He would rather see the download count of these polyfill libraries https://github.com/ljharb/ljharb#projects-i-maintain increase, compared to assessing the health of the JavaScript ecosystem.
-
The Best ESLint Rules for React Projects
An obvious pick for React projects, but eslint-plugin-react along with their plugin:react/recommended rule set is a must. This will give you some sensible rules such as requiring a key to be specified in JSX arrays. eslint-config-airbnb is another good (if a bit loose) base rule set on top of eslint-plugin-react to start from.
-
Avoid "&&" Operator for Conditional Rendering in React
If you already have the eslint-plugin-react installed, you can enable the following rule.
-
Create React UI Lib 1.1: Ladle and ESLint
You can also add ESLint now (props to @femincan for the suggestion). It comes with recommended settings for these plugins: typescript, prettier, react, react-hooks, jsx-a11y.
- Confusion over one of the examples of the jsx-no-literals linting rule
-
What's weirdest webdev practice in your company?
Also for what it’s worth, there’s a React ESLint code rule that can enforce this behavior either way for Component props - I’m not in front of a code base atm, but I wonder if my preference for the syntax above is influenced by a popular linting preset like AirBnB which enforces this rule? https://github.com/jsx-eslint/eslint-plugin-react/blob/master/docs/rules/jsx-curly-brace-presence.md
-
Removing Default React Imports. For a Cleaner Code
The missing piece is on this page, in a small note at the end of the page: the eslint rule to disallow missing React when using JSX.
-
Ask HN: What are you predictions for 2023?
Thanks for weighing in, that's good to know. After wondering if this could be auto-refactored, I came across https://github.com/jsx-eslint/eslint-plugin-react/blob/maste..., will definitely have to give that (with `--fix`) a try in the new year and see if I can get the team on board! – desire for typescript being a compelling factor.
Personally I do like the non-destructured `props.abc` throughout component code, really helps clarify at a glance where something is coming from, whether it's locally or externally defined, etc. Code style is an endless exercise in compromises/opinions though, even _with_ tools like eslint and prettier.
-
Recommended React Hooks Convention
eslint-plugin-react react/hook-use-state
React
-
Inflight Magazine no. 9
We are continuing to add new project templates for various types of projects, and we've recently created one for the infamous combination of React with Vite tooling.
-
"Kawaii" tech logos by Sawaratsuki
Go to https://react.dev/?uwu=true for a surprise.
-
Building an Email Assistant Application with Burr
You can use any frontend framework you want — react-based tooling, however, has a natural advantage as it models everything as a function of state, which can map 1:1 with the concept in Burr. In the demo app we use react, react-query, and tailwind, but we’ll be skipping over this largely (it is not central to the purpose of the post).
-
React 18.3.0 Is Out
Oddly, no info on changelog: https://github.com/facebook/react/blob/main/CHANGELOG.md
-
Preact vs React: A Comparative Guide
In this post, we get to know more about Preact, one of this year's trending libraries. And we'll compare it to React to see which one suits better for our projects.
-
Meet Cheryl Murphy: Full-Stack Developer, lifelong learner, and volunteer Project Team Lead at Web Dev Path
Cheryl Murphy is not only a dedicated full-stack web developer skilled in technologies like React, Next.js, and NestJs but also a community-driven professional who recently took on the role of volunteer project team lead at Web Dev Path. With a dual Bachelor's degree in Computing and Chemical Engineering from Monash University, Cheryl’s journey in tech is marked by a passion for building accessible solutions and a commitment to fostering community within tech.
-
How to Build an AI FAQ System with Strapi, LangChain & OpenAI
Basic knowledge of ReactJs
-
Everyone Has JavaScript, Right?
Google Translate and many other libraries break React based sites if they are using refs.
I don't think that point it falls under "written on naive assumptions"
https://github.com/facebook/react/issues/11538
the issue says closed but you can easily catch it in various sites and use cases.
-
Integrate Bootstrap with React
This article serves as your comprehensive guide to mastering the art of combining Bootstrap and React seamlessly. Dive in to uncover the tips, tricks, and best practices to elevate your UI design game effortlessly.
-
React Server Components Example with Next.js
This isn’t an accident; when Meta introduced React Server Components, Dan Abramov explicitly stated that they collaborated with the Next.js team to develop the RSC webpack plugin.
What are some alternatives?
stylelint-config-prettier - Turns off all rules that are unnecessary or might conflict with prettier.
qwik - Instant-loading web apps, without effort
berry - 📦🐈 Active development trunk for Yarn ⚒
Alpine.js - A rugged, minimal framework for composing JavaScript behavior in your markup.
prop-types - Runtime type checking for React props and similar objects
Vue.js - This is the repo for Vue 2. For Vue 3, go to https://github.com/vuejs/core
javascript - JavaScript Style Guide
SvelteKit - web development, streamlined
razzle - ✨ Create server-rendered universal JavaScript applications with no configuration
lit-element - LEGACY REPO. This repository is for maintenance of the legacy LitElement library. The LitElement base class is now part of the Lit library, which is developed in the lit monorepo.
eslint-plugin-prettier - ESLint plugin for Prettier formatting
Tailwind CSS - A utility-first CSS framework for rapid UI development.