chibivueStep by Step, from just one line of "Hello, World". powered by VitePress
chibivue
chibivueStep by Step, from just one line of "Hello, World". powered by VitePress
I created the exact same app in React and Vue. Here are the differences. [2019 Edition]
Having used Vue at work, I had a fairly solid understanding of it. I had, however, been curious to know what the grass was like on the other side of the fence — the grass in this scenario being React. Note: there is a new version of this article that can be found here: https://sunilsandhu.com/posts/i-created-the-exact-same-app-in-react-and-vue-2020-edition I’d read the React docs and watched a few
![I created the exact same app in React and Vue. Here are the differences. [2019 Edition]](https://cdn-ak-scissors.b.st-hatena.com/image/square/a229f2668ed6825521466698ba6ff56beed1178d/height=288;version=1;width=512/https%3A%2F%2Fmiro.medium.com%2Fv2%2Fresize%3Afit%3A1200%2F1%2AfiKg1ve_EvCP5FIImxXNGQ.png)
開発部の横溝です。 昨年、弊社ANDPADの機能「施工管理」をNuxt化するプロジェクトが始動し、停止しました。 「停止」というと残念な感じがするので、充電期間に入ったと言い直しておきます。 「Nuxt化するプロジェクト」とは？ 背景 改めて、この記事について Nuxt化が始動して、停止した話 まず、エンジニアがそれを「やりたかった」 Nuxt化のはじまり 停止 いま、Nuxt化のリポジトリはどうなっているか プロジェクトの恩恵 残された課題 さいごに 追記(2021.03.12) 「Nuxt化するプロジェクト」とは？ 2020年3月~2020年11月に実施した、レガシーコードをリプレイスするプロジェクトです。 前述の「施工管理」は、社内でも特に昔からある機能なのですが、フロントエンドに、主にRuby on Rails（slimテンプレート）+ AngularJSを利用しています。それを、
はじめに 最近金髪から黒髪に戻して更生しました藤井（フロントエンドエンジニア）でございます。久々にテックブログに貢献させて頂きます！ 今はメインの施工管理機能の改修の傍ら、新機能開発にも携わっておりまして、フロント側はSSRモードのNuxtを採用しております。さて、そんな中SREチームから「フロントエンドがメモリリークしていませんか？」との通報が入りました。 いやいや、そんなハズは・・と思いながらもDatadogを見てみると見事にメモリ消費量が右肩上がりに増えていってます。なぜじゃ・・・。 調査開始 メモリリークになるような処理を入れた覚えはないぞ！と思いつつも調査開始です。ひとまずChromeのDevtoolでPerformanceやMemoryタブを見ながら確認しますが、これと言って原因が見つかりません。 おかしい・・。なんでだろう。 あれこれ試しましたが解決せず、ほぼ1日消化しました
2021年7月14日 Nuxt JS, Vue.js, Webサイト制作 WordPessで作成していた私のポートフォリオサイトをNuxt JSで作り変えてみました。デザインや内容はそのままで、管理体制を変えた感じですね。Nuxtに移行した理由や悩んだところをまとめてみます。 ↑私が10年以上利用している会計ソフト！ 移行を決めた理由 元々私のポートフォリオサイトは、まだ私が学生だった頃にWordPressの勉強用に作ったものです。その後何度かリデザインしながら公開していました。ブログなどはつけておらず、制作物の紹介を投稿記事として扱っていました。ただ、制作物は更新する頻度も高くはなく、WordPressでなくてもいい気がしてきていました。また、WordPressやPHPのバージョンを上げるたびにエラーを出すプラグインの対応に疲れてきていたところでした…。 そんな中出会ったのがGatsby
#SaaS_Frontend で発表した、SaaSプロダクトのKARTEの開発におけるプロダクトの国際化(i18n: Internationalization)についてです。 こちらの本にもi18nについて書いてますので、もしよろしければ眺めてみてください。 みんなのVue.js - 現場で役立つ実践ノウハウ
データサイエンティストの基本的な副業の流れ データサイエンティストのsatomacoto（@satomacoto）です。普段は、解析に必要なIoTデバイスやWebアプリのソフトウェア開発から機械学習モデルの開発・デプロイまで携わるソフトウェアエンジニア/データサイエンティストとして働いています。本稿では、データサイエンティストとして短期間で成果を出すために気をつけていることについて執筆します。 1.契約前・オンボーディング 一口にデータサイエンスの案件といっても、その言葉が表す職務は、「モデル開発」「特徴量エンジニアリング」といったデータサイエンスそのものに関わるところから「アーキテクチャ」「データ整備」といったソフトウェア・インフラに関わるものまで広範囲に及びます。 契約前・オンボーディングでは、クライアントがどこまでの範囲をどの程度の期間で実現したいか、そして限られた自分の時間でどこま
※ この記事は2021年6月21日に行われた「進化するフロントエンド2021 − 4プロダクトから学ぶSPA/PWAの技術と実践−」の登壇を文字起こししたものになります noteのフロントエンドの歴史 ではまず自己紹介をさせていただきます。フロントエンドエンジニアの山形と申します。よろしくお願いします。 去年の3月に入社したので、noteには1年3ヶ月くらいいます。趣味でコーヒーの焙煎とかやっています。 今回はnoteが抱えているフロントエンドの課題をどう解決していったのかを話していきたいと思います。 最初にnoteが今までどうやって実装されていたのか、その歴史を説明していきます。 初期のnoteはRuby on Railsのアセット上に構築されたSPAサイトで、フロントはAngularJSとCoffeeScriptで書かれていました。 この構成はかなりの問題を含んでいました。 1つ目はS
サーバレスのバックエンド作成サービス「AWS Amplify」で認証認可機能付きのダッシュボードを作る
「Amazon Web Services」（AWS）活用における便利な小技を簡潔に紹介する連載「AWSチートシート」。今回は「AWS Amplify」を使って認証認可機能付きのダッシュボードを作成します。 「AWS Amplify」とは Amplifyの公式サイトでは下記のように説明されています。 AWS Amplifyは、それぞれを連携させたり個別で使用したりできる、ツールとサービスのセットです。これらの機能により、フロントエンドウェブおよびモバイルのデベロッパーが、AWSによるスケーラブルなフルスタックアプリケーションをビルドできるようにします。Amplifyを使用するお客様は、数分の内にバックエンドを構成しアプリケーションと接続でき、また、静的なウェブアプリケーションのデプロイは数クリックだけで実行できます。さらに、AWSコンソールの外部でも、簡単にアプリケーションコンテンツの管理が
Vue.jsを使ってメンテナンスツールを作ってみた - MicroAd Developers Blog
ご無沙汰しております。 マイクロアドでアプリケーションエンジニアをしているNです。 約1年前「JavaScriptフレームワーク（Vue.js）を導入して」というタイトルでブログを執筆させていただきました。 その時、 興味を示して頂き何らかの反応をいただければ、きっと別の社員がもう一歩踏み込んだVue.jsのお話を書いてくれるんじゃないかと期待しています。 と書いたっきり誰も続いてくれなかったので1年越しではありますが、責任持ってアプリケーションエンジニアの N 動きます。 社内メンテナンスツールをつくってみた 最近WEB開発してないんです。 実は去年の4月ころからだいたいバッチしか作らないチームのリーダーにさせていただきまして、それからずっと趣味以外でWEB開発をしてません。 （実は前回のブログを書いた時にはもう。。。） でもWEB開発したい！JS書きたい。。。 そうだ！バッチのメンテナ
*Nuxt.js 3で使う場合、一部のUIフレームワークは外部ライブラリが必要 結論 なんでもいい、早めに成果物をみたい：Quasar Element+ レスポンシブサイトを構築したい：Quasar 高度なカスタマイズができるUIフレームワークを使いたい：TailwindCSS PrimeVue スマートフォンサイトだけを構築したい：Vant IOS、Android、EXEアプリを作りたい：Quasar 補足 Vuetify 3はリリースしたばかりなので、結論に含まれていません クロスプラットフォームについて本記事は特に話しません SEOに気になれば、Nuxt.jsがおすすめです。SPAアプリは生まれた時からSEOに弱いです 🔰 学習の初心者へ： Vuetify 2がおすすめです。参考資料が多くて、Vuetify 2の場合は公式サイトで日本語のドキュメントもありますので、勉強しやすいと思
はじめに UL Systems Advent Calendar 2019 の17日目です。 Blazorとは、.NET の技術を使ってクライアント側のWeb UIを構築するためのフレームワークです。このBlazorを使えば、今まで主に業務アプリケーションの開発で C#を使用してきたような開発者であっても、極力JavaScriptを使わず、追加の学習コスト少なくWebアプリケーション(SPA)を開発することができるようになります。 Blazor には、サーバ側で処理するBlazorサーバーと、クライアント側で処理するBlazor WebAssemblyがあります。Blazorの開発を今まさに進めており、2019年9月にリリースされた.Net Core 3.0にてBlazor サーバーが正式にサポートされるようになりました。Blazor WebAssemblyも2020年5月に正式リリースされ
Vue 2.xのOptions APIからVue 3.0のComposition APIへの移行で知っておくと便利なTips - ZOZO TECH BLOG
こんにちは。ECプラットフォーム部のMA（マーケティングオートメーション）アプリケーションチームで、社内向けのマーケティング運用ツールを開発している長澤（@snagasawa_）です。 先日、日本時間の2020年7月18日にVue 3.0のRelease Candidate(v3.0.0-rc.1)がリリースされ、今後は最終リリースまで主要なAPIのbreaking changeは想定していないとのアナウンスがされました。アナウンスを受け、現在社内ツールで進めているOptions APIからComposition APIへの移行で得られたTipsについて紹介します。 この記事では公開時点でのVue 3.0 betaへのアップグレードの方法と、Vue + TypeScriptでのOptions APIからComposition APIへの移行のTipsについてまとめました。Vue 3.0への
STORES.jp入社3ヶ月で気づいたこと ~Nuxt.js 移行における 未来を見据えたコンポーネント設計~ / Components Design of Frontend in STORES.jp
STORES.jp Meetup for Front-end Engineers #1 (https://hey.connpass.com/event/143246/ )の発表資料です。 STORES.jp入社3ヶ月で関わったアイテム編集ページ移行PJTでのコンポーネント設計について発表しました。
はじめに Vue.jsを普段開発で使っていて、SVGとの相性がすごく良いと感じてます。 Vue.jsのドキュメントでもアニメーションなどの紹介もされていますが、 今回はブラウザで編集可能なGUIの土台として、 使えそうなTipsを書いていきたいと思います。 Vue.jsのプロジェクトを作成していく 今回使っていくのはVueCLI v3.xの環境で開発していきます。 標準でプロジェクト作成のUIなども付いており、非常に開発しやすいです。 SVG内でズーム・パン風の機能を実装してみる 早速ですが、SVG内でズーム・パン風の機能を作って見たいと思います。 下記のような感じになります。 （MacBookProなどのノートPCですと二本指で開いてズームしたり、 二本指でスライドして、移動したりして、操作が実感しやすいと思います。） コードで実際に実装するとこのような形です。 移動の場合は差分値分移動
はじめに https://svelte.jp/ 皆さんはSvelte使っていますか？ 私はReactやVueをよく利用していましたが、最近Svelteにハマっています。 Reactヘビーユーザーの私が感じた、Svelteの良いところ、改善してほしいところを挙げてみました。 Reactを使う上で特に不満があったわけでもないですが、Svelteに乗り換えてみると無駄が多かったことに気付かされました。 私の思うSvelteの良いところをいくつか挙げさせていただきます。 書きやすい、分かりやすい SvelteはReactと同様に、宣言的にUIを記述することが出来ますが、Reactと比べてより少ないコードで書けるようになっています。 例えば、React.useEffectのような記述は、以下のように書くことが出来ます。
こんにちはdelyでサーバーサイドエンジニアをしているyamanoiです この記事は「dely #2 Advent Calendar 2020」の12日目の記事です。 adventar.org adventar.org 昨日は@yochidrosさんの「KMMでiOS・Android を共通化しよう」でした。 みなさんwebサイトを作成する時にSPAを利用していますか？ SPAはユーザーに対してメリットが大きいですが、SEO観点やOGPタグのレンダリング等で SSRが避けられない場面に出くわすことがあると思います。 SSRが不要であればビルドして生成された成果物をs3等でホスティングするだけなのでデプロイや、運用が楽なのですが、 SSRをするとなるとNode jsの実行環境必要になります。 ある程度大きなプロジェクトであればECSやGKE, GAEに載せてガッチリと運用すべきだと思いますが
Qiita TypeScript Advent Calendar 2020 最終日の記事です。 TypeScript製の内部リンク取得ライブラリ「pathpida」 最近ちょっと話題になった frourio と aspida を開発したSolufaです。 Zenn初投稿を記念して、新作ライブラリ「pathpida」を紹介します。 と言っても完全な新作ではなく、初回リリースからもうすぐ1年が経ち月間DL数は1,000を超えています。自分が関わる案件だけで静かに検証を続け、ようやっと今週全面リニューアルして一般告知が出来るようになりました！ pathpidaはNext.jsとNuxt.jsそれぞれのルーティング規約に最適化しているので設定不要で型安全に使うことが出来ます。 どんな問題を解決するのか 以下のように/post/1 に遷移するLinkがあるとします。 import Link from
Vue.jsでシンプルなローディングを表示する「vue-loading」の使い方 | DevelopersIO
Vue.jsでローディングを表示 Webアプリにおいて、非同期処理を行うこと（APIを呼び出してデータを取得するなど）はほぼ必ずと言っていいほど必要なことです。また、非同期処理中にはローディングを表示しておき、ユーザーに処理を待っている状態であることを伝える必要があります。 Vue.jsでローディングを表示するモジュールは様々ありますが、中でも個人的に気に入った「vue-loading」をご紹介します。シンプルで使いやすいのでオススメです。 使い方 まずはVueプロジェクトが作成済みの前提で進めます。 以下のコマンドでインストールします。 $ yarn add vue-loading-template あとは表示したいViewでモジュールをインポートして使います。 <template> <div class="container"> // 使用 <vue-loading type="spi
Glyphs
Access the SourceJoin us in Figma and GitHub to contribute to ongoing development and request new icons & features.
Vue.js(SPA)でhead要素のtitleとdescriptionはページ別に設定しよう【SEO対策】 - かとのぼのマイコード・マイライフ
Vue.js(SPA)でサイトを作るときは、head要素をページごとにちゃんと設定しないと、グーグルの検索画面になかなか載らないため、対策が必要です。 SPAでサイトを作るとhead要素がページごと変化しない問題 Vue.jsでhead要素titleとdescriptionの変更する方法 規模が小さいサイトなら、各ページmounted SPAでサイトを作るとhead要素がページごと変化しない問題 SPA（シングル・ページ・アプリケーション）は、その名前の通り、一つのHTMLのページで、まるで色々なページに切り替わっているように見せる技術です。ページの遷移も早く、作りやすいです。 しかし、実際はページが切り替わっていないため、別のページに移動しても、何も設定をしないとhead要素は変わらないままです。 これがとても問題で、ページごとにhead要素が変わるように対策をしないとグーグルの検索にな
処理の共通化とコンポーネントの分割/分類/粒度について
じまぐ @nakajmg Frontend Engineer at PixelGrid Inc. + 副業 （元DMM.comラボ 7年前？
こんにちは。倉内です。 WebサイトやWebサービスの開発に欠かせないJavaScriptは、人気も高く習得したいと考えている方も多いのではないでしょうか。エンジニアへの就職活動をしている学生や、未経験からエンジニアになろうという方にとっても、JavaScriptは習得しておきたい言語の1つです。 動的なWebページの作成といったフロントエンドで用いられるのはもちろん、Node.jsに代表されるようにサーバサイドプログラミングでも存在感を増しています。また、jQueryやReact、Vue.jsなどフレームワークも豊富です。 初めて学ぶプログラミング言語としてJavaScriptを選ぶ方も多いと思いますので、今回は基本・基礎を学びたい初心者の方へ向けたコンテンツから、しっかり学びを深めたい中上級者向けのものまで、JavaScriptを学びたいすべての方へ向けて、学習コンテンツと書籍をご紹介
Nuxtで毎日やりたいことを習慣づけるWebアプリ「コツコツ忍者」を作った🏃♀️【個人開発】 - Qiita
お久しぶりです。 以前、Nuxt.jsとFirebaseでchocottoというTwitterでお菓子と一緒にメッセージを送れるサービスを作ったG4RDSです。 先週、二十歳を迎えて成人しました🎉 今は高専五年で、編入試験を受けている真っ只中です。 適度にお酒を入れて、今後も個人開発頑張っていこうと思います！ さて、今回作ったWebサービスは「コツコツ忍者」というWebアプリです。 昔ばなしに、忍者は跳躍力向上のために毎日成長していく小さな木を飛び続けた、というお話があるのをご存知ですか？ ある能力を向上させたいのであれば毎日継続してやり続けることが大事である、ということですね。 自分が好きなことは続けられますが、好きではないけど上達したいことは続かないからなかなか上達しません。 そんな「上達したいけど続けられない」ことがある人のために、毎日やったことを記録できるWebアプリを作りました
技術について思っている印象とかを、定期的にまとめておくとあとで見直したときに良い振り返りになるかもしれないなと思ったのでまとめておく。 上記の目的でやるので思い切り主観で書く。 Vue について思うこと composition-api がとてもいい。 composition-api で頑張るなら React 使えよみたいな意見を耳にしたことがあるが、Vue の良いところは、template と style が JS と別個で動くというところだと思っているので、composition-api の前身である Option API が改善したところで、React と比較してどうこうみたいな見解の変化はない。 Vue を使っている限りは、基本的には CSS in JS 戦争に巻き込まれないので平和。 Vue3 をまださほどキャッチアップしていないので適当な意見になるが、SFC の書き方自体が結構変
![[ポエム]VueとReactとCSSについて思うこと2021/1月版](https://cdn-ak-scissors.b.st-hatena.com/image/square/c5b1a7d33962fdef07ef6cb7b48fb4f1fd91dbdf/height=288;version=1;width=512/https%3A%2F%2Flh3.googleusercontent.com%2Fa-%2FAOh14GjOZkrZMgKwcEyykl5_iULVEVkUUJd793r9_z8DF4s%3Ds250-c)
こちらは、Webアクセシビリティ Advent Calendar 2019 の２１日目の記事です。 Vue.js 開発における Web アクセシビリティ対応にまつわる内容となっております。（英訳記事） この記事は公開から１年以上が経過しています。内容が一部古い箇所があります。 自己紹介 大山奥人（おおやまおくと）と申します。ネット上では、おおやまみちのく、yamanoku と名乗って活動しています。 制作会社の Web デザイナーとして働き出し、株式会社GEEK でマークアップ・フロントエンドエンジニアとして従事した後、2019 年 10 月から株式会社クラウドワークスに在籍しております。 役職は UX エンジニアです。個人ではアクセシビリティ啓蒙も行っています。 著書 これからはじめるwebアクセシビリティ 技術書典で「これからはじめるwebアクセシビリティ」という技術同人誌を発表しまし
[アップデート]AmplifyがNext.jsとNuxt.jsを利用したSSR（Server Side Rendering）に対応しました！ | DevelopersIO
AmplifyがNext.jsとNuxt.jsを利用したSSR（Server Side Rendering）をサポートしました！ Amplify JavaScript adds server-side rendering (SSR) support for frameworks like Next.js and Nuxt.js これまで、AmplifyはSPAで構築するのが基本でしたが、SSRな構成をとることもできるようになり、選択の幅が広がったと思います！ このSSR環境をさっそく構築してみました！ 構成図 AmplifyでNext.jsを利用してSSR環境を構築するとこんな感じの構成になります。 Serveless Frameworkを利用して、Lambda@EdgeでレンダリングするSSR可能なCloudFrontを構築することで、SSRを実現しています。 構築してみた Amplif
![[アップデート]AmplifyがNext.jsとNuxt.jsを利用したSSR（Server Side Rendering）に対応しました！ | DevelopersIO](https://cdn-ak-scissors.b.st-hatena.com/image/square/194a9cfb6a3c1c20634fa9a82024d910930e4552/height=288;version=1;width=512/https%3A%2F%2Fdevio2023-media.developers.io%2Fwp-content%2Fuploads%2F2019%2F05%2Faws-amplify.png)
OpenAPI Generator + TypeScript で始める自動生成の型に守られた豊かなクライアント生活 | GiFT（ギフト）株式会社
OpenAPI Generator + TypeScript で始める自動生成の型に守られた豊かなクライアント生活2020.02.28 OpenAPIをドキュメントだけでなく、Schema firstな開発に利用しようということで、TypeScript + OpenAPI Generatorでフロントエンドの開発をしました。 Vue, Nuxtで使う際の例と共にその内容を紹介します。 目次OpenAPIでドキュメントを書くメリットなどOpenAPI GeneratorでClient情報を吐き出すVue, Nuxtで利用するAPIの変更に追従しやすく、型もあるし幸せOpenAPIでドキュメントを書くメリットなど弊社では以下のブログでも書いているように、API仕様のドキュメント化にOpenAPIを活用しています。 committee×OpenAPI×RailsでスキーマファーストなAPI開発O
OpenAPI × Orval × MSW × Next.jsでのスキーマ駆動開発実践 #techtekt Advent Calendar 2022 - techtekt
この記事は techtekt アドベントカレンダー2022 の15日目の記事です🔥 その他にも記事が掲載されていますので、興味がある方は#techtekt Advent Calendar 2022で検索してみてください！ はじめに はじめまして。パーソルキャリア株式会社のサービス開発部でエンジニアをしている西澤と申します。 HR forecasterという採用支援サービスのフロントエンドエンジニアを担当しています。今回はそのプロジェクト内で新たに組み上げた開発体制で導入したスキーマ駆動開発の流れについて紹介したいと思います🙋♂️ 目次 開発環境 導入背景 スキーマ駆動開発って何？ OASのディレクトリ構成 OASを利用した型の生成・モックコードの生成 Next.jsでMSWを動かす おわりに 開発環境 Next.js 12.3.4 React 18.2.0 TypeScript 4.
TL;DR v3は独自テンプレートのコンパイル時に、差分検知の最適化を行っている 「静的要素の巻き上げ」と「パッチフラグ」による最適化 この最適化によって、レンダリングと差分検知処理の速度がv2より100%向上している JSXの場合は最適化されないため、独自テンプレートが推奨される レンダリング関数とは Vue.jsは、記法がJSXか独自テンプレートかに関わらず、最終的にVue.jsのレンダリング関数に変換されます。これはReactなど他の仮想DOMフレームワークも同じです。 例えばこのようなJSXテンプレートは、以下のように変換されます。
# ShowNote:「フロントエンド開発の便利ツール・設定・プラグインなど」を語るフロントエンドTechCafe #2 ## イベントページ https://rakus.connpass.com
Ginza.js#3 https://ginzajs.connpass.com/event/136794/
本エントリは2021年8月30日に開催されたNode学園 37時限目 オンラインにて、「Vue 2で大きなデータを扱うときの性能改善手法」というタイトルで発表させていただいた内容をテックブログ記事化したものです。発表当日の様子はYouTubeにアーカイブで公開されておりますので、そちらも合わせてご覧いただけましたら幸いです。 はじめにストックマークでは、法人ユーザー向けに「Astrategy」というウェブサービスを開発・提供しています。Astartegyの詳細や技術的な全体構成についてはAstrategyを支える技術: gRPC, Elasticsearch, Cloud TPU, Fargate… SaaS型AIサービスの内側の世界というエントリで紹介しておりますのでそちらを参照いただくとして、本エントリではAstrategyのフロントエンドを構築する上で重要である性能改善手法について紹
はじめに こんにちは、レストランボード（以下、RB）のフロントエンドチームの石亀です。担当していた規模の大きめなプロジェクトでVueを結構触っていまして、設計含め困難と向き合いながら色々取り組ませてもらったのでそれをナレッジとして残そうと思い記事を書くことになりました。エモいですね。 RBは現在自社のフレームワークで構築されていて、徐々にVueでリプレイスをかけています。 今回、大規模なプロジェクトにてVueでさらなるリプレイスを実行しましたが、プロダクト自体がとても大きく且つ限られたリソースの中でいかに負債化させずにできるだけ安全に移行させるかを検討しました。 そこで実際に実施した施策や検討内容などを紹介します。 おそらく、多くのサービスやプロダクトで既存のコードを新しいライブラリ・フレームワークで書き換えているかと思います。 背景だったり関わる規模・コンテキストが異なるとは思いますが、
eslint-plugin-vue で来たる Vue.js 3 のリリースに備えよう - BASEプロダクトチームブログ
フロントエンドチームの右京です。 Vue.js 3 が八月上旬にリリース予定ということで、BASE でもバージョンアップに向けて少しづつアクションを始めています。 Vue.js 3 では多くの機能が追加され開発の幅が広がりますが、一方で削除や非推奨となる機能も多く頭を悩まされている方もいるのではないでしょうか、BASE もそうです。 この記事では ESLint とその Vue.js 向けプラグインの eslint-plugin-vue を利用した、deprecated となる機能へのアプローチを紹介します。 なぜ eslint-plugin-vue か ESLint には Vue.js の SFC のためのプラグインとして eslint-plugin-vue が開発されていて、BASE でもこれを利用しています。 このプラグインには vue/no-deprecated- で始まるルールがい
ANDPADフロントエンドエンジニアの小泉です。 昨年の夏頃、担当したプロダクトで新規リポジトリでの開発を立ち上げる機会があり、Nuxt 3 を用いて構築を行いました。 アップデートではなく新規で Nuxt 3 サイトを構築するのは業務としては初めての経験だったのですが、Vue 3・Nuxt 3 の様々な機能によって、型安全な状態を保ったまま快適な開発を進められ、かつ3ページの全体実装を約7営業日で形にすることができました。 この記事では、「いま新規サービスのゼロからの立ち上げにNuxt 3を選択するとどんな嬉しいポイントがあるのか」という実例をご紹介できればと思います。 担当したプロダクトについて ANDPAD資料承認 | 製品のご紹介 2023年10月にリリースされた「ANDPAD資料承認」という、資料の申請・承認を一元管理する機能のフロントエンド開発を担当しました。 ただし、紹介サイ
10km40分切りが2020年の目標、メドピア長距離部の小宮山です。 みなさんTailwind CSSはご存知でしょうか。tailwindとは「追い風」を意味します。最高に気持ちよく走れるコンディションですね。 目次 サービス概要 技術概要 Tailwind CSSとは何か HTMLとCSS HTMLとCSSとコンポーネント コンポーネントと雑なセレクタ コンポーネントとインラインスタイル Tailwind CSSがもたらしたもの まとめ サービス概要 まずは今回新たに立ち上げたサービスの紹介です。 「MedPeerスポット×リクルートメディカルキャリア」という医師向けスポット求人マッチングサービス（以下、本サービス）が11月にリリースされました。 medpeer.co.jp ログインや応募などサービスのコアな部分はMedPeer医師会員限定になってしまいますが、サイトの雰囲気自体は非会員
はじめに インターンでお世話になっている、コウゲと申します。現在担当させていただいている仕事は業務で使用している管理画面のマイクロサービス化です。 マイクロサービス間をつなぐ認証機能が必要だったので、認証プラットフォームとして使いやすそうな 「Auth0」で どんなことができるのか、実現したいことは可能なのかを検証してみることになりました。 なぜAuth0なのか ダッシュボードの設定 + 少ないコード で認証機能が簡単に実装できる。 Auth0専用ライブラリやSDKが多数存在し、目的に応じてそれを利用することで 簡単にログイン機能を実装することができる。 実現したいこと 発表 ありがたいことに、調べた結果を社内で発表する場を設けていただきました。 ブログの内容より少し詳しく書いています。読んだら即実装できるようなスライドを心がけて作りました! speakerdeck.c
Django REST framework + Vue.js「SEIYU風のECサイトを作りましょう」全6回（予定） - Qiita
前書き 本記事はまだ連載中、更新頻度は大体週に一回(多分)、忙しさ次第 コンテンツ紹介 バックエンドはDjango (Django REST framework) + 管理システムはXadmin フロントエンドは Vue.js + Vue Router + Vuex 動作確認リンク 読んで欲しい人 Python大好き Pythonの基礎的な文法を把握しています Pythonでウェブサービスを作りたい Djangoの環境構築をしたことがある Vue.jsに興味がある Vue.js のCLIでプロジェクトを作ったことがある 環境説明 PyCharm
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
guijs
AngularJSからVueへの置き換えを8ヶ月やってみて得られたこと - ANDPAD Tech Blog
NuxtのSSRモードでメモリリーク？原因はaxios? - ANDPAD Tech Blog
ポートフォリオサイトをNuxt + Netlifyに移行しました
プレイドにおけるプロダクトの国際化の取り組み | 野田 陽平 PLAID, Inc
データサイエンティストが副業で成果を出すためのチェックリスト | Offers Magazine
Next.js + SvelteによるnoteのフロントエンドApp分割｜note株式会社
Vue3のUIフレームワーク／UIライブラリ紹介と比較 - Qiita
Web開発でJavaScriptの代わりにC#でロジックを書くBlazorがめちゃ便利！ - Qiita
ライブラリ不要！Vue.jsとSVGで簡単に動かせるUIを作る - Qiita
Reactヘビーユーザーが思うSvelteの良いところ - Qiita
Cloud Runで手軽にサーバーレス・SSR(サーバーサイドレンダリング) - dely Tech Blog
設定0行でNext.jsとNuxt.jsの内部リンクを型安全に取得できる最強ライブラリ「pathpida」
【初心者〜中上級者向け】JavaScriptの学習サービスと書籍27選 - paiza開発日誌
[ポエム]VueとReactとCSSについて思うこと2021/1月版
Vue.js から考えるアクセシビリティについて - 2019
Vue.js 3 は100%の速度向上をどう実現しているか - Qiita
ShowNote:「フロントエンド開発の便利ツール・設定・プラグインなど」を語るフロントエンドTechCafe #2 - HackMD
漸進的な変更を支えるフロントエンド設計
Vue 2で大きなデータを扱うときの性能改善手法
「レストランボード」における大規模フロントエンドの漸進的なVueリプレイスの取り組み
新規プロダクトの開発に Nuxt 3 を採用して良かったこと - ANDPAD Tech Blog
Tailwind CSSという風と共に走るフロントエンド開発 - メドピア開発者ブログ
Auth0を使ってSPA(Vue.js, Python)の認証機能を作ってみた - JX通信社エンジニアブログ
jp.cyberlink.com
www.tokyo-np.co.jp
www.okinawatimes.co.jp
7-24blog.com
pc-karuma.net
www.cnn.co.jp