タグ vite
人気順 5 users 50 users 100 users 500 users 1000 usersHonoで雑React SPA最小
2024/02/27
17 users
hono
クライント
stream
jsx
laisoさん
laisoさんが書いてたのほぼなんだけど Honoは文字列でもStreamでもなんでも返せるし、tsconfig.jsonで適切に設定すればJSXなんでもいけるし、Viteのdev-serverがあるから、サーバーもクライントも同時に開発、ビルドできるので、雑React SPA環境作るのに向いてるよ。 作り方解説します。めんどい人はここにプロジェクト... 続きを読む
フルスタック Web フレームワーク HonoX を使ってみる
2024/02/11
91 users
フルスタック
web
クライアントサイド
hono
honox
フルスタック Web フレームワーク HonoX を使ってみる 2024.02.10 HonoX は Hono と Vite をベースにしたフルスタック Web フレームワークです。Hono が提供するサーバーサイドやクライアントサイドの機能を使いつつ、ファイルベースルーティングや Islands Architecture などの新しい機能を使うことができます。 HonoX ... 続きを読む
MicroCMSとViteで作るかんたん静的サイト | DevelopersIO
2023/10/11
12 users
DevelopersIO
ビルドツール
Sass
HTML
この記事では、ヘッドレスCMSを使ってHTMLコンテンツを生成する手順を紹介します。 前回の記事（MicroCMSと11tyで作るかんたん静的サイト）ではAPIデータの取得とHTMLの生成のみを行いましたが、今回はSassを使うためにビルドツールであるViteを導入して、より実制作に近い環境での検証をします。 ビルドツールであればG... 続きを読む
2023-10-10のJS: Rollup 4.0.0、Viteの今後(Rustify Vite)、pnpm v8.9.0
2023/10/10
15 users
パーザ
SWC
acorn
rollup
JSer.info
JSer.info #664 - Rollup 4.0.0がリリースされました。 Release v4.0.0 · rollup/rollup Node.js 14/16のサポート終了、Acornの代わりにSWCをパーサに使うように変更されています。 SWC利用に伴うオプションの削除や非推奨なオプションの削除などが含まれています。 Viteの現在と今後についてがViteConfで発表されていま... 続きを読む
フロントエンドをViteからNext.jsに書き換えた話 〜パフォーマンス編〜 - 株式会社ヘンリー エンジニアブログ
2023/06/02
17 users
Swe
Henry
React
アーキテクト
set
こんにちは。4月にヘンリーに入社したSWE / アーキテクト / SETのsumirenです。 弊社ではレセコン一体型クラウド電子カルテの Henry を開発・提供しています。 今回、HenryのフロントエンドをReact + ViteからNext.jsに書き換えました。 この記事では、最初にNext.jsへの切り替えによってもたらされたユーザー体験の向上... 続きを読む
Webブラウザ上にNode.jsを実装、Webブラウザ上のサーバサイドでNext.jsやVite、Astroなどが実行可能な「Sandpack 2.0」が登場
2023/02/19
13 users
astro
サーバサイド
CodeSandbox
実装
抽象化
Webブラウザ上にNode.jsを実装、Webブラウザ上のサーバサイドでNext.jsやVite、Astroなどが実行可能な「Sandpack 2.0」が登場 クラウド上でマイクロVMベースのオンライン開発環境などを提供するCodeSandboxは、Webブラウザ上で抽象化したNode.jsを実装しWebブラウザ上にJavaScriptのサーバサイド環境を作り出すことで、W... 続きを読む
Vite/VueでChrome拡張機能を作ってみる | 4. 環境構築/開発編 - くらげになりたい。
2023/01/14
32 users
Vue
くらげ
aut
Chrome拡張機能
備忘録
前回の続き。Vite/CRXJS/Vueで作るときの備忘録(*´ω｀*) www.memory-lovers.blog 使ったサンプルはこちらで公開中(*´ω｀*) github.com 環境構築 プロジェクトの作成 # viteでプロジェクトを作成 $ pnpm create vite chrome-extension-sample --template vue-ts $ cd chrome-extension-sample # .npmrcを設定 $ echo "aut... 続きを読む
レガシーなMPAアプリケーションをwebpackからviteに移行する話
株式会社iCAREでは、Vue2.6(※2.7に移行中)+Composition APIで開発を行っており、vue2系では比較的モダンな構成です。一方、Ruby on RailsのView毎にVueインスタンスを生成するMPAであり、アプリケーション全体の構成としては、レガシーな構造になっています。 エントリーポイントが多いことによる弊害で、サービス拡大に... 続きを読む
React + Goで簡素な掲示板アプリを作ってみた | フューチャー技術ブログ
2022/08/27
15 users
React
TypeScript
フロントエンド
新人
勉強中
はじめにこんにちは。金融グループ所属、新人の藤戸四恩です。 本記事は夏の自由研究ブログ連載2022 5日目の記事です。 今回は勉強中のReact、TypeScript、Goを使って掲示板アプリを作りました。 夏の自由研究ということで、以前から気になっていたviteを使って開発しました。 いままでフロントエンドの開発環境を作成す... 続きを読む
CRAからViteへ移行して190倍高速なdev server起動を得る - inSmartBank
2022/04/25
13 users
inSmartBank
Cra
ビルドツール
手順
背景
ある日突然、あなたに190倍（当社比）高速なdev serverができたらどうしますか...？ この投稿ではWebアプリケーションのビルドツールをCreate React AppからViteへと移行した背景・手順・結果について説明します。 Vite等のビルドツールやフロントエンドアプリケーションの開発体験に興味・関心がある方、中でもCreate R... 続きを読む
Playwright & Vite ではじめる脱レガシー向け軽量 Visual Regression Test - Cybozu Inside Out | サイボウズエンジニアのブログ
2022/03/18
18 users
playwright
サイボウズエンジニア
ブログ
こんにちは！フロントエンドエキスパートチームの @mugi_uno です。 みなさんは Visual Regression Test は普段活用していますか？ 昨今では事例もよく耳にするようになった印象です。一度使って手放せなくなった方もいるのではないでしょうか。 今回の記事では、通常のプロダクト新規開発とは異なる “脱レガシー” の文... 続きを読む
やっぱりwebpackがわからない（エピソード1）
2022/01/29
338 users
Webpack
わし
ネーミング
Vue.js
エピソード
webpackがわからない 最近はViteが注目されだして、実際にとても良いビルドツールです。Vue.jsのEvan Youさんが開発しただけのことはありますね。ネーミングもイカしてます。しかし、だからといって、では開発環境にViteを採用しようと簡単にはできないのが、業務の辛い所です。新しい技術を採用して、「わしが全責任を... 続きを読む
2022年の最新標準！Vue 3の新しい開発体験に触れよう
2022/01/20
18 users
Vue 3
ICS
ライブラリ
Vue.js
コア
2021年のVue.jsは新しいVue 3のコアが安定し、開発環境からライブラリやコードの書き方まで、新しい発表の多い一年でした。ICSではすでに複数のプロジェクトでVue 3やVite等の新しいフレームワーク・ツールを使用していますが、まだまだ様子見という方も多いでしょう。 変化の大きいVue 3の周辺ですが、2021年11月のVueC... 続きを読む
Vite + React で新規プロジェクトの開発環境を作ろう
2022/01/18
21 users
React
ウィード
ビルドツール
備忘録的
新規プロジェクト
2022年1月18日 JavaScript, React Viteは2020年に発表されたフロントエンドのビルドツールです。最初「ヴァイト」と読んでたんですが、「ヴィート」と読むみたいですね。フランス語で「速い」という意味だそうです。絶賛Reactのお勉強中なので、ViteでReactの環境を作る流れを備忘録的にまとめておきます！ この記事は動... 続きを読む
Cloudflare Pages + Functions + Workers KV + vite + preactで簡単なページを作った
2021/11/29
19 users
Functions
Preact
ルーレット
リポジトリ
都度
今回作ったページは下記。 https://haropuro-shuffle.pages.dev/ 元ネタ リポジトリ YuheiNakasaka/haropuro-shuffle 簡単なルーレットアプリ。ルーレットで出た結果をWorkers KVに保存。保存された文字を都度更新して表示(リアルタイムではない)。結果が1000件を超えるとクリアされる。 開発の流れ Workers KVの設定 vi... 続きを読む
Frontend Weekly LT（社内勉強会）で「Vite」について LT しました - BASEプロダクトチームブログ
2021/07/29
14 users
RRY
base
フロントエンドエンジニア
毎週
業務委託
はじめまして、フロントエンドエンジニアの @rry です。 BASE では社内勉強会として「Frontend Weekly LT」を毎週開催しています。 今回は Vite 特集で LT をしたので、Frontend Weekly LT の紹介も兼ねて内容を発信していきたいと思います。 Frontend Weekly LT とは BASE はフロントエンドエンジニアが、業務委託の方... 続きを読む
jQueryからTypeScript・Reactまで - Viteで始めるモダンで高速な開発環境構築 - ICS MEDIA
2021/07/08
443 users
jQuery
ウィード
ビルドツール
ICS MEDIA
作者
Vite（ヴィート＝フランス語で「速い」の意味）は2020年に発表された新しいフロントエンドのビルドツールです。 開発者がVue.jsの作者であるEvan You氏であるため、Vue.jsのツールであると誤解されることもありますが、プレーンなJavaScript（バニラJS）からVue.js・React・Svelteといった流行のフレームワークまで、さ... 続きを読む
Native ESM 時代のフロントエンドビルドツールの動向
2021/03/09
111 users
Native ESM
動向
Webpack
rollup
時代
No Bundle ツールの流行: vite / rollup モダンブラウザは Native ESM を備えているので、開発時は高速な localhost アクセスを頼って直接 import する、外部ライブラリだけ事前にコンパイルしておく、という手法が流行ってきている。プロダクション用は今まで通りビルドする。 webpack はすべてを一つにバンドルするた... 続きを読む
Vue3への期待が広がる! Vue.js v-tokyo Meetup #11 参加レポート - Qiita
2020/08/26
12 users
Qiita
SFC
スライド
Vue.js
Vue3
2020/08/25に開催されたv-tokyo#11の参加レポートです。 とても良い勉強会だったので見逃した方は是非スライドだけでも!! まちにまった Vue.js 3 @kazupon ?スライド： https://speakerdeck.com/kazupon/matinimatuta-vue-dot-js-3 ? 内容メモ： - SFCの改善PRについて - Viteの紹介 - vuedxの紹介 SFCの改善PR の内容... 続きを読む
フロントエンドの爆速な開発サーバを実現する Vite を試してみた - SMARTCAMP Engineer Blog
2020/06/18
89 users
爆速
フロントエンド
開発サーバ
こんにちは！スマートキャンプでエンジニアをしている中川です。 先日Twitterを何気なく眺めていたところ、Vue.js 生みの親の Evan You氏が何やら興味深いツイートをしているのが目に止まりました。 As I was going to bed, I had an idea about a no-bundler dev setup (using native browser ES imports), but with su... 続きを読む