VanillaなJavaScriptからReactを使い出した時の前後のコードを見つめてみる - Qiita
初めに ただの記録です。 Reactに移る前のコードと移った後のコードを貼っているだけ。 VanilaなJavaScriptでの記載 移行前の前(createElementを多用) document.createElementをひたすら使ってるパターンです bodyの中身が全部tdでいいならさらにmapでいいんですが、 各カラムで別々の何かを適用させたい場合はひたすら変数が増えていくパターン...(嫌すぎる) See the Pen Untitled by sinsky (@sky-sora) on CodePen. コード(codepenの内容と一緒です) window.addEventListener("DOMContentLoaded", () => { // 使用するデータ // https://www.tiobe.com/tiobe-index/ const tableData
2022-08-18のJS: Astro 1.0、Node.js 16.17.0、DenoとBunの今後の予定
JSer.info #605 - React/Vue/svelteなどのUIフレームワークを利用でき、コンテンツファーストのウェブサイト向けフレームワークであるAstro 1.0がリリースされました。 Astro 1.0 | Astro betaからの変更点としてSSR Buildsの追加、画像の最適化をする<Image>と<Picture>の追加、MDXサポート、Vite 3.0へアップグレードが行われています。 Astro 1.0 Beta Release | Astro マイグレーションガイドは次のページに公開されています。 Migration Guide 🚀 Astro Documentation Node.js v16.17.0がリリースされました。 Node v16.17.0 (LTS) | Node.js Node.js 18からのbackportが中心となりますが、uti
Babel が Flow から TypeScript に移行した
先日 Babel のメンテナーとして知られる Nicolò Ribaudo 氏が次のツイートを投稿した。 We finally finished migrating the Babel monorepo from Flow to TypeScript! It has been a very long process started by @z_bodya, and after migrating package-by-package @JLHwung just opened this PR 😄 pic.twitter.com/WKXxV8x2MY — Nicolò Ribaudo 🏳️🌈 • 💙💛 (@NicoloRibaudo) July 23, 2022 そう、JavaScript のトランスコンパイラである Babel のソースコードが Flow から TypeScrip
React Distros
Table of Contents [X] React Distros Table of Contents The Carlota Perez Framework The Deployment Age of JavaScript Frameworks What other React Distros should exist? React Distros for Toolmakers React Distros and The Deployment Age of JavaScript Frameworks James K Nelson raised an interesting point recently: So Mr. Abramov has been telling us #reactjs is a UI runtime. To me, that sounds like React
JavaScript/WebAssemblyをCDNエッジで実行するCloudflare Workersが、Python、Scala、Kotlin、Dart、Reasonへの対応を発表
JavaScript/WebAssemblyをCDNエッジで実行するCloudflare Workersが、Python、Scala、Kotlin、Dart、Reasonへの対応を発表 Cloudflareは、JavaScript/WebAssemblyをCDNエッジで実行するサーバレス基盤「Cloudflare Workers」が、Python、Scala、Kotlin、Dart、Reasonの各言語に対応したことを発表しました。 #ServerlessWeek continues at Cloudflare. Today, we’re excited to announce that you can also build applications on Cloudflare Workers using Python, Scala, Kotlin, Reason and Dart htt
2022-08-02のJS: Privacy Sandboxのロードマップ更新、Docusaurus 2.0、Electron v20.0.0
JSer.info #603 - Google Chromeでのサードパーティクッキー廃止に代わるAPIとしてPrivacy Sandboxという一連のAPIが提案されています。 元々は2023年半ばからサードパーティクッキー廃止を段階的に進める予定でしたが、今回このロードマップが更新されています。 Expanding testing for the Privacy Sandbox for the Web Privacy Sandbox APIのリリースは2023年Q3まで延期され、サードパーティクッキーの段階的な廃止は2024年後半まで延期されています。 詳しいロードマップは次のサイトで公開されています。 How We’re Protecting Your Online Privacy - The Privacy Sandbox 静的サイトジェネレータのDocusaurus v2リリース
Rustとdeno_coreを使って、独自のJavaScriptランタイムを作ってみる
Node.js、Denoに続いて、Bunという新たなJavaScriptランタイムが登場していますが、Denoの7月29日のブログにて、"Roll your own JavaScript runtime"という記事が投稿されていたので紹介します。 タイトルの通り、自分のJavaScriptランタイムを作ってみよう！という記事です。 作り方は元記事に載っているのでここでは省略して、掻い摘んだ内容をまとめていきます。 JavaScriptランタイムの材料 Rust deno_core tokio Rustのdeno_coreとtokioというクレートを使って作っていきます。 deno_core deno_coreって、もうそれdenoじゃんと思いましたが、こちらのクレートはJavaScriptエンジンであるV8との橋渡し的な役割を持つようです。 deno_coreは、複雑で大量のAPIを持つV
Roll your own JavaScript runtime | Deno
In this post we’ll walk through creating a custom JavaScript runtime. Let’s call it runjs. Think of it as building a (much) simplified version of deno itself. A goal of this post is to create a CLI that can execute local JavaScript files, read a file, write a file, remove a file and has simplified console API. Let’s get started. Update 2022-12-04: updated the code samples to the latest version of
2022-07-20のJS: Node.js 18.6.0、React NativeのHermesデフォルト化、AWSのデザインシステム
JSer.info #601 - Node.js 18.6.0がリリースされました。 Node v18.6.0 (Current) | Node.js Node.js 18.6.0ではexperimentalで実装されている--loaderの挙動の変更が含まれています。 複数の--loaderを指定した場合の順番を変更。またloaderの実装はshortCircuitを返すのが必須となっています。 そのため、すでに公開されているloaderが動かなくなっている場合があります。 詳しくは、次のIssueと記事で解説されています。 esm: add chaining to loaders by JakobJingleheimer · Pull Request #42623 · nodejs/node Custom ESM loaders: Who, what, when, where, why
みんなが簡単簡単書いているので、React + JavaScript + FullCalendar を触ってみた - Qiita
みんなが簡単簡単書いているので、React + JavaScript + FullCalendar を触ってみたJavaScriptNode.jsnpmFullCalendarReact Glideでカレンダー形式の予約アプリを作ったら紙以下と言われた 詳しくは書きませんが、 会社の会議室予約管理を紙でやっていて、テレワークの促進とともにに紙の弊害が目立ち始めたので、Glideでサクッとアプリ化してみました 見出しの通りで激おこなので、フルスクラッチで作ることに決めました。 画像は紙以下で検索して出てきたイメージ画像です。 React + FullCalendarというありきたりなライブラリではありますが、 既存の記事がTypeScript向けのものが多かった 本当の初心者はどこにソースを追加すれば良いのかわからない 忘備録 以上の理由で記事を執筆します。 Reactを触ったことがなくても
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
How to Memoize Functions and Values in JavaScript and React
JavaScriptにセミコロンは入れるのか？入れないのか？ - Qiita
TypeScript vs. JavaScript
TypeScript(JavaScript)によるカタカナ五十音順の行を判定 - Qiita
Language I/O Runs React-Based Javascript with Java Backend
@stencil/core vs lit-html vs preact vs solid-js vs svelte | npm trends
Starting Out in Software Engineering? Don’t Bother Learning React JS. | Built In
Alternatives to React: Inferno.JS
Install a Next.js and a Vite.js Applications Into a Monorepo
@stencil/core vs lit-element vs lit-html vs preact vs solid-js vs svelte | npm trends