ありの〜ままの〜 React 見せるのよ〜
最近 React のコードリーディングに付き合ってくださる方がいらっしゃいましてコードを読んでいるのですが、読むにあたってはそもそもユーザーが書いた React がどう実行されるかエントリポイントをはっきりさせたくなりました。 たとえば const App = () => { const [state, setState] = React.useState(0); return ( <div> <p>state: {state}</p> <button onClick={() => { setState(state + 1); }} >click me</buttn> </div> ); }; のようなコードを実行したときのエントリポイントは分からないわけです。 なので JSX で書いたコードを変換かけて読む環境を作りました。 babel での変換 まず一般的に JSX は React の
GitHub - AlexSergey/rockpack: Rockpack is a lightweight, zero-configuration solution for quickly setting up a React application with full support for Server-Side Rendering (SSR), bundling, linting, and testing.
Rockpack is a lightweight, zero-configuration solution for quickly setting up a React application with full support for Server-Side Rendering (SSR), bundling, linting, and testing. In just 5 minutes, you can get up and running with a modern React app that's optimized for performance and best practices. Perfect for developers who want to skip the setup and focus on building their app! Instant SSR:
GitHub - alan2207/bulletproof-react: 🛡️ ⚛️ A simple, scalable, and powerful architecture for building production ready React applications.
React is an excellent tool for building front-end applications. It has a diverse ecosystem with hundreds of great libraries for literally anything you might need. However, being forced to make so many choices can be overwhelming. It is also very flexible, you can write React applications in any way you like, but that flexibility comes with a cost. Since there is no pre-defined architecture that de
21 Best Practices for a Clean React Project
Photo by Diana Polekhina on Unsplash.React is very unopinionated about how things should be structured. This is exactly why it’s our responsibility to keep our projects clean and maintainable. Today, we will discuss some best practices to improve your React application’s health. These rules are widely accepted. As such, having this knowledge is imperative. Everything will be shown with code, so bu
React State Management Libraries and How to Choose
The idea of state is one of the trickier things to nail down when you’re starting with React, and as your app grows, so do your state management needs. In this post I’ll give you the Grand Tour of state management options in React and help you decide which one to use in your project. What is State? Just so we’re on the same page, let’s talk about state for a second. Every interactive app involves
fullPage scroll snapping. Create full screen pages fast and simple
The best! Proud of being the most complete framework of its kind. Trusted by the most innovative companies. Compatible Working in modern and old browsers too! Make a beautiful site for all! Not just a few! Easy! fullPage.js is designed to be easy to use and customize. It includes tens of examples, great documentation and both community and personal support.
2020 年、 React 軸で学ぶべき技術 - mizchi's blog
なぜ仮想 DOM という概念が俺達の魂を震えさせるのか - Qiita から 5 年経ち、 仮想 DOM を備えた React やそれを採用した Vue や他のライブラリも市民権を得たように思います。 有用な技術が市民権を得る、というのはエコシステムが花開くことでもあります。新しいプロダクトを作る際の技術選定において、 TypeScript + React が常に正解というわけではないですが、このスタックはかなり強力だという手応えがあります。 このスタックは得意のウェブフロントエンドは勿論、それ以外もとりあえず 80 点ぐらいの品質でプロトタイピングできる、というようなエコシステムになってきたような肌感があります。 モダンフロントエンドだと TypeScript と Webpack は採用しているのを前提として、本記事では React を軸にその技術を活かすために、次の 6 個の技術を紹介
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - exhibitionist-digital/ultra: Zero-Legacy Deno/React Suspense SSR Framework
フロントエンドのデザインパターン
Faster React Apps With Memoization
GitHub - steadicat/eslint-plugin-react-memo: memo/useMemo/useCallback all the things!
GitHub - joe-sky/jsx-sfc: A SFC like React function component API for managing CSS-in-JS and static members.
GitHub - TanStack/virtual: 🤖 Headless UI for Virtualizing Large Element Lists in JS/TS, React, Solid, Vue and Svelte