はじめに 先日、仕事で参加させてもらっているプロジェクトでVueを3系にバージョンアップしました。 続いて、TypeScriptが入っていなかったので入れたのですが、なかなか<script setup lang="ts">の知見がネットになかったのでここに軽く共有できたらと思います。 前提 Vueは3.2系（<script setup>が使えるのは3.2系から） TypeScriptは4.5.5(vue-createするとこれが入る) webpacker... ts-loader 有用なドキュメント集 おそらく<script setup>自体は簡単に書けるようになってすぐ慣れると思うのですが、TypeScript対応が結構癖があって困ります。 なのでこれらの公式ドキュメントをよく読むようにしましょう。 SFC<script setup>TypeScript のみの機能 https://v3
GitHub - effector/effector: Business logic with ease ☄️
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
Vue.js with TSX - From Vue 2.x to Vue 3 #v_tokyo11
2020/08/25 の #v_tokyo11 で話した登壇スライドです。
Vue3にアップグレードしてフロントエンドを改善した話 - SMARTCAMP Engineer Blog
vue3-migration-improve-frontend はじめまして！ BALES CLOUDエンジニアのえーす（井上）です。この度、BALES CLOUDで長年使ってきたVue2から卒業し、Vue3を導入した状態でリリースできました。今日はこれについてお話できればと思います。 やったこと なぜVue3移行をしたか TypeScriptサポート 各ライブラリが古い Vue2のEOLが近い 具体的なVue3移行ステップ Vuetify卒業 Vue3導入 Vue3完全移行 移行にあたって問題だったこと ライブラリのアップグレード Vuetify卒業 ElementUI -> ElementPlus 巨大PRによるレビュー負荷 チーム体制 マイグレーションビルドと他ライブラリの相性 よかったこと 課題感 これから 2024/04/03 編集部追記 やったこと Vue2を卒業し、Vue3を
はじめに 本連載では、JavaScriptを利用して動的なWebページを構築できるフレームワークVue.jsを、データの型指定ができるように拡張されたAltJS（コンパイルしてJavaScriptにする言語）であるTypeScriptで活用する方法を、順を追って説明しています。 Vue.jsにおいて、Webページのある一部分を構成する実装単位を「コンポーネント」と呼びます。これまでの連載記事では、Webページ全体に対応するコンポーネント（App.vueファイル）を単体で利用してきましたが、より表示が複雑な実際の開発では、1つのWebページを複数のコンポーネントに分割して開発するのが一般的です。そこで本記事では、複数のコンポーネントを利用してWebページを作成する方法を説明します。 対象読者 これからVue.jsに入門したい方 新しいトレンドを常に取り入れたい方 比較的複雑なWebページをV
作ったもの 記事タイトルの通り、Vue.jsで再描画が走ったコンポーネントの輪郭をフラッシュしてハイライトしてくれるChrome拡張 + npmパッケージを作りました。 GitHub: yuichkun/vue-devtool-flash-updates 背景 Vueの開発をする上で、Vue.js devtools を使っている人は多いと思います。 React Developer Tools では以前から再描画されたコンポーネントを光らせてくれる機能があり、パフォーマンス問題の解消などに役立っていたのですが、どうやらVue devtoolsにはそれがないらしいことをissueなどから察しました。 今回作ったプラグインの導入方法のイメージはRedux Devtoolsと似たような感じで、 専用Chrome拡張のインストール 有効にしたいプロジェクトでnpmパッケージの追加・プラグインの導入設
【追加/削除】Pythonのlist（リスト）の使い方を徹底解説 | AKKODiS（アコーディス）コンサルティング株式会社
Pythonには多数の値を一つにまとめて管理するための、コレクションまたはコンテナと呼ばれるデータ型が複数存在します。list（リスト）はその一つで、他のプログラミング言語における配列のような使い方ができるデータ型です。 listには任意の型のデータを格納でき、格納された要素には順序が設定されています。これらの要素はインデックスを用いて指定することができ、listの要素は変更することが可能です。この利便性の高さから、他のコンテナと比較してPythonをコーディングする際に最も目にするのがlistでしょう。 今回はこのlistについて、サンプルコードとともに使い方を徹底解説していきます。 Pythonには多数の値や要素をまとめて管理するデータ型としてリスト、タプル、辞書、集合という4種類が提供されています。この4種類はコレクションまたはコンテナとも呼ばれているデータ型で、listは他のプログ
2021 / 2020 / 2019 JavaScriptライブラリのトレンドを紹介しているbestofjs.orgが、2020年に最もホットであったJavaScriptライブラリのランキングを発表しました。 選考基準は現在のスター数ではなく、『2020年の一年間で増えたスターの数』です。 過去流行っていたけど落ち目となった技術は出てこないので、最近注目されている技術がわかります。 ちなみに2016年の総合ランキング1位はVue.js、2017年の総合ランキング1位はVue.js、2018年の総合ランキング1位はVue.js、2019年の総合ランキング1位はVue.jsです。 以下は2020年のランキング、2020 JavaScript Rising Starsの日本語訳です。 JavaScript ライジングスター 2020 5回目のJavaScript ライジングスターにようこそ！ こ
VueとCSSとTypeScriptでシューティングゲーム「ネコメザシアタック2020」を作ったのでソースと解説 - Qiita
こんにちは 今日は2/22の猫の日に合わせて個人開発したゲーム「ネコメザシアタック」の技術的なポイントを解説する記事です。去年のバージョンはこちら 作ったもの ソース： https://github.com/yuneco/mezashi2 アプリ： https://nekomzs2.web.app/ （PCでも遊べるけどスマホ推薦です） 使っている技術 そろそろリリース見込みのVue3を先取りした構成です Vue(Vue2 + CompositionAPI) TypeScript CSS Transition（ほとんどのアニメーション） SVG（画像 + 一部のアニメーション） Firebase (Hosting + FireStoreでランキング) おしながき（この記事の内容） 作ったもの全部を解説していくとキリがないので、主に去年からの差分を中心に面白いポイントだけ説明していきます。
Vuex is an awesome state management library. It's simple and integrates well with Vue. Why would anyone leave Vuex? The reason can be that the upcoming Vue 3 release exposes the underlying reactivity system and introduces new ways of how you can structure your application. The new reactivity system is so powerful that it can be used for centralized state management. Do You need a shared state? The
みなさんこんにちは。 現在、フロントエンドでは宣言的UIが大流行しており、そのためのフレームワークも Vue.js をはじめ複数存在しています。 （React はフレームワークではなくライブラリです） 同種のソフトウェアや言語があれば、自分の好みを巡って意見を出し合うのはエンジニアの常でして。 それがパフォーマンスに関することであれば、無関心ではいられなかったりするわけです。 とはいえ Evan You もいうように特定のフレームワークやライブラリが現実世界のパフォーマンスの問題を銀の弾丸のように解決できるわけではありません。 フレームワークの開発者が数10ミリ秒単位でパフォーマンス改善に勤しむなか、利用する企業が（数100ミリ秒要するような）広告会社のスクリプトを迷いなく追加したりするのですから。 それでも僕たちは、パフォーマンスの話題をせずにはいられません。 だって、それがエンジニアで
Pug を HTML に移行して .vue ファイル の template タグ内に ESLint を効かせた話 - SMARTCAMP Engineer Blog
こんにちは！スマートキャンプでインサイドセールスに特化した SaaSを作っているエンジニアの中川です。 上記プロダクトのフロントエンドは Vue.js を用いて開発しているのですが、 その中で SFC 内のtemplateタグで使用していた Pug をやめて HTML に移行した件をこの記事ではお話しようと思います。 また、実際にtemplateタグに ESLint を効かせてみて発覚したエラーや警告のなかで数が多かったものや、これから Vue 3 に移行していく上で対応する必要があったルールを紹介します。 背景 eslint-plugin-vue が効かない チームに Pug 推進派がいない Pug を HTML に移行するには Vue 3 に準拠した Lint ルールを導入する Lint を実行してみる 対応した目ぼしいルール vue-require-v-for-key vue/val
2022年10月の「TechFeed Night #4 - フロントエンドアーキテクチャを語る」でSvelte/SvelteKitのユースケースやReactやVue.jsとの併用について紹介してくれた山下裕一朗さんはSvelteのメンテナーとしても活動中です。日々、Svelteの情報発信をひたすら続けている山下さんに、なぜSvelteにそこまで入れ込むのか、Svelteの魅力はどこにあるのか、Svelteへのアツい思いをあますところなく語っていただきます! 今回話を伺ったエキスパート フォローしよう！ Attention! 本記事では何度かVue.jsとの比較が登場します。Vue.jsと比較する理由は以下の2点です。 私が業務で Vue.jsを使用しておりある程度わかるから 読者の皆さんもよく知っているであろうVue.jsとSvelteを比較することで理解を促進できるであろうから この記事
Vue.jsとFirebaseで爆速でアプリをPRする掲示板を作ってみた 現在、業務委託としてMikatus株式会社にてお世話になっております。 主に税務システムのサーバーサイドの開発を担当しています。 今回はMikatus株式会社のアドベントカレンダーに参加させてもらうことになりました。 自分、めちゃくちゃ硬派なので他の人みたいに面白い記事は書けませんがお付き合いいただければと思います。 非エンジニアの方が読んでも楽しめるように、文章の中に心の声と実際に出た声がありますが、 事実を基にしたフィクションです。 自分、硬派なジェントゥルマン（紳士）なんで。 硬派ですが物腰とかマシュマロくらい柔らかいんで。汚い言葉とかまぢ無理。 初めに 本記事ではアプリを作りにあたってハマった点などのノウハウを記載します。 Vue.jsやFirebaseについて技術的なことについては書籍や多くのWebサイトで
<script setup> useSeoMeta({ title: 'Meet Nuxt', description: 'The Intuitive Vue Framework.' }) </script> <template> <div id="app"> <AppHeader /> <NuxtPage /> <AppFooter /> </div> </template> <style> #app { background-color: #020420; color: #00DC82; } </style> Static or Dynamic, the choice is yoursDecide what rendering strategy you need at the route level. By leveraging the hybrid rendering, you ca
ブラウザバックしたときに状態を復元する（Vue3, Nuxt3 そして Next.js） - Qiita
ブラウザバックは Web アプリの鬼門 Vue に限らずですが、Web アプリにおいてブラウザでバックボタンやフォワードボタンの実行に対応するのはなかなかに難しい問題です。そのため、POST Back 型のフレームワークではブラウザバックの使用自体を禁止することも多かったと思います。 SPA全盛の今、この問題は解決されたのでしょうか。 いえ、状況はむしろ悪化しています。テンプレートエンジンを使った HTML 生成型の Web サイトであれば、ブラウザバックを行うことで、フォームの値とスクロール位置は復元されますが、JavaScript ベースで構築された画面ではフォームの値は保存されませんし、スクロール位置が復元できるかも条件次第です。 一般的な解決策 では、Twitter に代表されるSPAアプリではこの問題にどうやって対応しているのでしょうか。答えは「対応しない（あるいはスクロール位置
いいね・タグ付け・フォロー・Googleログイン機能を持つ記事投稿型SNS風Webサービスを開発！PHP/Laravelの様々な知識やVue.jsの導入方法、Sendgridを使ったメール送信、本番環境デプロイなどWebアプリ開発に役立つ知識を学ぶ。
Vue Router Next - 意外と語られない Vue 3 時代のルーティング / Vue Router Next - Routing in the Vue 3 that is not talked about unexpectedly
生田望 （LINE株式会社） 「UIT meetup vol.10 『Vue 三昧』」での発表資料です https://uit.connpass.com/event/187267/
ネタ系アプリ「キモツイ」で使用した技術（Vue.js+Firebase+Buefy）の基本的なセッティング方法 - Qiita
構想から半日の爆速でリリースしたネタ全振りWebサービス「キモツイ」の構成技術とその基本的なセッティング部分の解説です。 作ったサイトはこちら キモツイ 「クソツイ」じゃない「キモツイ」だ！ 「キモツイ」は「クソツイ」とは違う新たな概念です。ちょっとキモい感じが漂うツイートを「キモツイ」と私たちは愛を込めて呼びます。 当サイトは、キモいツイートを誰でも投稿・シェアできるサービスです。 お気に入りキモツイには「キモ投票」ができ、100票集まると殿堂入りします。 ぜひお気に入りのキモツイを投稿・シェアしてみてください。 ブログに遊び方書いています。ブログ Vue.js + Firebase + Buefy(Bulma)のお手軽三点セット 気軽な個人開発ではもうおなじみの、フロントは「Vue.js」バックエンドはサーバレスの「Firebase」という構成です。加えてUIも楽したいのでBulmaベ
はじめに この記事では、フロントエンドのレンダリングパターンの 1 つである Islands Architecture について概略した上で、Astro における Islands Architecture の実現方法をチュートリアル的に解説します。Astro は 2022 年の 8 月に v1 がリリースされたばかりの UI フレームワークであり、ユーザーもまだそれほど多くはないと思われるため、なるべく前提知識がない方でも理解できるように各ステップの説明を細かく噛み砕いておこなうつもりです。また最後に補論として、Astro v2 について本論と絡めて簡単に紹介します。 Astro と Islands Architecture Astro は、高いパフォーマンスを実現するウェブサイトをモダンな DX (Developer Experience) のもとで開発することを目指した UI フレーム
Vue2系からVue3系に移行しました〜！ - Link and Motivation Developers' Blog
こんにちは！リンクアンドモチベーションでフロントエンドの開発をしています。岡田（@okadaike）です。 本日は弊社プロダクトのストレッチクラウドのVueのversionを2系から3系にmigrationしたので、そのご報告になります！！ 今回はプロダクトチームの中で色々と試行錯誤して進めました！ストレッチクラウドはSPAが3つあるような構成になっており、今回はそのうちの一つを移行しました！。 最後に残りの２つの移行計画もまとめようと思います！ Vue2は2023年末にEOLを迎えるのでこれからどんどん移行していくことになると思いますが誰かの役にたてればなと思います！ ※余談ですが先日Vue.js v-tokyo meetup#16に参加してきました。その中で世界のアクティブVueユーザーの内6~7割はVue2を利用していると伺いました。 今年のこれからはVueのmigration祭りに
約10万行の規模のフロントエンド環境にTypeScriptをマイグレーションした話 - MicroAd Developers Blog
お久しぶりです。フロントエンドエンジニアの川上です。 業務では、UNIVERSE Ads のフロントエンド開発、フロントエンドの開発環境改善などを担当しています。 はじめに TypeScriptの導入について 導入にメリットがあると結論を出した理由 ① フロントエンドでテスト駆動様開発が可能になる ② Vueコンポーネント に対して TypeScript の恩恵を与えられる 具体的に解説 1つ目のメリットについて 2つ目のメリットについて おわりに はじめに マイクロアドには様々なプロダクトがありますが、私の担当している UNIVERSE Ads について、 フロントエンドフレームワークにVue.js を利用しています。 jp.vuejs.org 開発構成としては、MVVMでバックエンドとフロントエンドはそれぞれ、Spring Boot（Kotlin, Java）, Vue.js（Type
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
はじめに フロントエンドエンジニアの @mk0812 です。自分は普段BackOfficeというチームで新規機能開発を担当しています。 この記事ではBASEのフロントエンド周りの事例として「Monorepo」を紹介します。 エンジニアの皆さんなら1度は聞いたことあるかもしれませんが、BASEではここ最近Monorepoにしていきました。 具体的にどこをMonorepoにしてるかというとBASEの管理画面にある基本機能とBASE Appsです（下図）。 前者はBASE管理画面で使用する機能を指しており、後者はショップにより充実した設定を追加したり、新しい機能が必要となる時に追加できる機能で、数多く提供されていて、その機能単位もしくはApp単位でMonorepo化されています。 基本機能とBASE Apps Monorepo とは 「Monorepo」とは単一のリポジトリである特定のプロジェク
Storybook6をVue.jsのプロジェクトに導入し、新機能であるStorybook Argsを活用してVue.jsのDXを最高にした話 - Qiita
Storybook6をVue.jsのプロジェクトに導入し、新機能であるStorybook Argsを活用してVue.jsのDXを最高にした話JavaScriptVue.jsフロントエンドJeststorybook はじめに 最近iCAREさんの所でVue.jsを一緒にやらせていただいているのですが、フロントの技術スタックがかなりモダンであり、開発体験が良く、ノウハウをどんどん公開して良いと言っていただけたので、その内容を共有するシリーズです. 今回は2日前にリリースされたStorybook6をVue.js + TypeScriptのプロジェクトに導入した話をします(執筆時点). 前置き Storybook自体はずっと使っていたのですが、6系に関してはbetaの頃からrfcとreleaseノートを全て追っかけて追っかけはじめ、使っていました. そしてついにrcが取れたので今回はその内容とiC
vuetify+vue/cliによるフロントエンドと、pythonのresponder+sqlite3によるAPIで、SPA（single-page application）のウェブサイトを実装してみたり - Qiita
vuetify+vue/cliによるフロントエンドと、pythonのresponder+sqlite3によるAPIで、SPA（single-page application）のウェブサイトを実装してみたりPythonSQLite3Vue.jsVuetifyresponder はじめに この前responderとSQLiteとの組み合わせで簡単なウェブサイトを作る例をしました。 今回はresponderとSQLに加えて、SQLデータベースと接続してデータの閲覧や追加や更新や削除したりできるSPA（single-page application）のウェブサイトにします。 フロントエンドは最近とても人気のjavascriptフレームワークであるvuetifyを使います。 vuetifyのコンポーネントは特に設定しなくてもレスポンシブデザインになっているというところは便利です。 pythonの方で
Vue.js 2.3.0から実装された 「.sync 修飾子」がVue.jsを書いていると陥るよくある困りごとを解決したので紹介します！ サンプルコードはこちら↓ https://github.com/harhogefoo/vue-sync-modifier-sample 対象読者 Vue.js 経験者 子コンポーネントに複数のプロパティをバインドさせたい人（Object型も含む） これから大量の入力フォームを子コンポーネントに分割して実装していくんだぜ...な人 よくある困りごと 例えば、新規作成(new)、 編集(edit)それぞれのページの共通のフォームのコンポーネントを実装する場合、 そのコンポーネントにフォームの情報を持つObject型のプロパティを渡したくなりますよね。 Vueでは、プロパティを渡した先でプロパティの情報を更新しようとすると、 以下のようなwarningログが出
新規プロジェクトでVue 3とTSXを導入した感想について、@spring_raining が @changhee.kim と @daisuke.yamamoto に聞きました。 Vue 3にTSXを導入した経緯 TSXとは？ TypeScript + JSX Vue 3では特に追加のプラグイン無くTSXが利用できる Composition APIのsetupで、TSXで書いたRender functionを返す 参考: ep.39 Vue 3 Study 『Render function で React の世界を覗いてみる』 templateに対するTypeScriptの型補完に不満を感じていた UIデザインに対するフロントエンドエンジニアの裁量が大きく、templateを利用するメリットが少なかった もしかしてただ使ってみたかっただけ？ Vue 3+TSXの開発体験/Vue 2やtem
概要 Vueの作者であるEvan You氏は、Vueのデフォルトバージョンが2022年2月7日以降3.x系に切り替わる事を開発者ブログにおいて発表しました。 それに伴い、Vue2.x系の最後のマイナーバージョンであるVue2.7が2022年7月1日にリリースされ、こちらの LTS (long-term support)はリリースから18ヶ月であることから、Vue2.x系へのサポートは2023年12月を持って完全に打ち切られる事となりました。 以下の記事でも語られている通りVue2とVue3では破壊的変更が多く、移行コストが格段に高いことから、多くの開発チームがVue３.x系への移行を頑張るかReact等の他のフレームワークへの乗り換えをするかの選択を迫られています。 3.x系へ移行すべきかフレームワークを乗り換えるべきかの是非についてはこの記事では触れませんが、Vueの破壊的変更に伴って多
Fower
Atomic PropsWrite styles with Atomic Props, rapid to develop complicated UI by composing Atomic Props. Scoped styleBorned with scoped styles, So don't worry any conflicts due to the globalnamespace. Type SafePerfect support for TypeScript, which bring Type definition,IntelliSense,Self documentation.
2021年のVueは結構動きが大きかったので、スナップショット代わりにちょっと振り返りのまとめを書こうと思います。 後半は2022年はVueとどうやって付き合うのが良さそうか、超個人的な見解を書きます。 ここ何年かのVueを使った個人開発をおさらい まずはここ何年かの個人制作からVueを使ってそうなものをリストアップして変遷を見てみます。ここ3年くらいのリポジトリから拾って並べたら、何となくVue3導入の歴史っぽくなりました。 なんか思ったほど作ってないけどそれは仕方ない。 2019.2 初代メザシアタック（ゲーム） リポジトリ： https://github.com/yuneco/mezashi 解説： VueとSVGを使ってシューティングゲーム『ネコ🐱メザシ🐟アタック🌟』を作ったのでソースと解説 開発環境: Vue CLI 言語: JS Vueのバージョン vue: 2.5.22
仕事でVueというかNuxtを選んで使っているんですけど、なんでだっけという部分を思い出してみる Reactも使っているので評価してどちらかを選定する話ではないです まずLaravelで構成されたソースコードがあってここにどうやって機能を後付けするかという部分を考えた 要件として特定のUIを実現するJavaScript SDKがあったのでこの時点でSPA+APIにした 次にその時点でVueがLaravelでJSを書く時のデフォルト選択肢だったのでVueにした SSRは不要なことが分かっていたのでvue-cliで構築して、複数画面への遷移が必要になった段階でルーターを試しNuxtへ移行した 私の中ではReactもVueも期待する同じDXを提供する高度で自作できないもの、という位置付けなので、Laravel側の選択肢に偏りがあるのならそれに従って問題ないという認識だった 仮に別のフレームワーク
社内UIライブラリを作る
こんにちは、monica です。 今回は弊社で開発している社内 UI ライブラリについて紹介します。 また、このプロジェクトは商用利用不可ですがオープンソースで公開していますので、ぜひご覧ください。 経緯 弊社ではこれまでフロントエンドを Vue2+ElementUI で開発してきました。 しかし Vue3 がリリースされ Vue2 のサポートが 2023 年末に終了することが決まったので、マイグレーションを行う必要がありました。 普通に Element UI を使っていれば、公式が提供している Migrator を使ってそこまで不便なくマイグレーションできます。 ですが勝手な外部からのスタイリングが当たっていたり、依存関係をどんどん増やしてしまった結果、Migrator を使うとアプリ全体が壊れるという状況になっていました。 ただたまに Element UI が直接スタイルを当てるように
はじめに銀座にうまいラーメン屋が多くて感動している岩下（@jaxx2104）です！これまでリクルートライフスタイルにて飲食業務支援アプリの開発をしていましたが、8 月からリクルートとサイバーエージェントのジョイントベンチャーである株式会社ヒューマンキャピタルテクノロジー(HCT)の開発チームリーダーとしてジョインしました 💪 従業員のコンディション可視化・改善ツール「Geppo」は回答画面と管理画面を WEB アプリケーションとして提供しており、Vue.js で作られています。 そんなフロントエンドにジョインして 1 ヶ月の改善の取り組みについて紹介したいと思います。 フロントエンド課題に取り組む技術レイヤーから開発フローまで業務上の課題を開発メンバー全員にヒアリングして課題設定をしました。 「問題に対する解をすぐ出せる」「自分の仕様把握になる」の二点を重視して、自分が元々フロントエンド
Remote DOM lets you take a tree of DOM elements created in a sandboxed JavaScript environment, and render them to the DOM in a different JavaScript environment. This allows you to isolate potentially-untrusted code off the main thread, but still allow that code to render a controlled set of UI elements to the main page. The easiest way to use Remote DOM is to synchronize elements between a hidden
ペイトナー請求書のフロントエンドにスナップショットテストを導入した話 - Paytner Tech Blog
はじめに ペイトナー請求書のフロントエンドを主に担当している @fuqda です。 本稿では、ペイトナー請求書のフロントエンドの品質改善の一つとして、最近実施したスナップショットテストの導入についてご紹介させて頂ければと思います。 この記事の対象読者 Vue.js / Nuxt.jsでJestのスナップショットテストを実装する方法について関心がある方 テストコードがないフロントエンドにこれから自動テストを導入しようとしている方 スナップショットテストとは？ スナップショットのテストはUI が予期せず変更されていないかを確かめるのに非常に有用なツールです。 https://jestjs.io/ja/docs/snapshot-testing Jestの公式ドキュメントにも記載があるようにHTML要素の差分を検査し、違いがあれば失敗にするテストのことです。 なお、CSSのスタイル崩れなどの検知
スマートキャンプのエンジニア入山です。 近年、ユーザ体験（UX）の優位性からSPA（Single Page Application）を採用しているWebアプリケーションを多く目にするようになりました。 弊社が8月1日にリリースした、インサイドセールスに特化したCRM Biscuet（ビスケット） も、Vue.jsを使ったSPAで構成されたサービスです。 SPAを採用することで多くのメリットがありますが、従来のMPA（Multiple Page Application）とは異なる運用ノウハウが必要になると思います。 今回はSPAをプロダクション運用する上で避けては通れない、リビジョンアップ時のクライアント側の対応をご紹介します！ SPAにおけるリビジョンアップ時の課題 リビジョン確認機能の実装方針 リビジョン確認機能の実装 アプリケーションにリビジョンIDを埋め込む リビジョン管理用JSON
LINEはなぜデザインシステムを取り入れたのか？ フロントエンドにおける価値と定義を解説 デザインシステムにおけるフロントエンド #1/2 2019年11月20、21日の2日間、LINE株式会社が主催するエンジニア向け技術カンファレンス「LINE DEVELOPER DAY 2019」が開催されました。1日目は「Engineering」をテーマに、LINEの技術の深堀りを、2日目は「Production」をテーマに、Web開発技術やUI/UX、プロジェクトマネジメントなど、より実践的な内容についてたくさんのプレゼンテーションが行われました。「デザインシステムにおけるフロントエンド」に登壇したのはLINE Front-end Standardizationチーム Front-end Engineerの岡崎晶彦氏。LINEはなぜデザインシステムを必要としたのか？ どのようにデザインシステ
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Vue3<script setup lang="ts">知見
Vue.jsでWebページをつくる際の肝！「コンポーネント」をTypeScriptで活用しよう
Vueの再描画されたコンポーネントをハイライトするChrome拡張を作った
JavaScript ベスト・オブ・ザ・イヤー 2020 - Qiita
You Might Not Need Vuex with Vue 3
Reactに有利なベンチマークを Vue.js で試したところ大差なく、そして…
【Svelteメンテナー 山下裕一朗】シンプルさこそがSvelteの真髄! その素晴らしさをメンテナーとして伝えていく
【入門編】Vue.jsとFirebaseでアプリをPRする掲示板を作る - Qiita
Nuxt: The Intuitive Vue Framework
Laravel(+Vue.js)でSNS風Webサービスを作ろう！ | Techpit
Astro で Islands Architecture を始めよう
LayerXのフロントエンドの現状の課題と理想の技術戦略
BASEフロントエンド Monorepo 化の取り組み - BASEプロダクトチームブログ
GCP連載#3 Goでサーバーレスな管理画面アプリを作る | フューチャー技術ブログ
【Vue】知っておきたい .sync修飾子のすゝめ - Qiita
ep.82 Vue 3のためのTSXという新しい選択肢 | UIT INSIDE
React HooksとVue Composition APIの比較
ここ3年くらいの個人制作を振り返って2022年のVueを考える（超私見）
Vue 2 からVue 3 に移行完了しました！ - クラウドワークス エンジニアブログ
なんでVueを使っているか｜laiso
ジョインして1ヶ月 Geppo のフロントエンドにおける改善の取り組み｜jaxx2104
GitHub - Shopify/remote-dom
実践！SPAでのリビジョンのズレ対策 - SMARTCAMP Engineer Blog
LINEはなぜデザインシステムを取り入れたのか？ フロントエンドにおける価値と定義を解説