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.
Hi! I want to discuss with you how to manage Frontend architecture in large organizations. It feels to me that there are not many articles about this topic and it is not explained well. By large organization in this article, I mean companies, in which the number of front-end engineers starts to be bigger than 15 and the company has at least multiple frontend projects. I don't want to discuss manag
Recently, my colleague Mike Bifulco wrote a blog post about using Near-Field Communication (NFC) technology to request payment using NFC tags and Stripe Payment Links. In a similar spirit, I came across the concept of “Ultrasonic payments”, a technology based on transferring data through inaudible sounds, and decided to experiment and look into how to implement such a payment method with Stripe. H
MSW 2.0やYarn 4.0のリリースなど : Cybozu Frontend Weekly (2023-10-24号) はじめに こんにちは!サイボウズ株式会社フロントエンドエキスパートチームの@nakajmg です。 サイボウズでは毎週火曜日にFrontend Weeklyという「一週間の間にあったフロントエンドニュースを共有する会」を社内で開催しています。 今回は2023年10月24日のFrontend Weeklyで取り上げた記事や話題を紹介します。 Introduction to web sustainability | MDN Blog webの持続可能性についての概要。フォントの最適化や画像サイズの縮小、JavaScriptの使用量を減らすことなどが挙げられています。 ガイドラインの作成も進められています。 How we optimized package imports
TypeScript のドキュメンタリーの公開など : Cybozu Frontend Weekly (2023/09/26号) こんにちは! サイボウズ株式会社フロントエンドエンジニアの nissy です。 はじめに サイボウズでは毎週火曜日に Frontend Weekly という「1 週間の間にあったフロントエンドニュースを共有する会」を社内で開催しています。 今回は、2023/09/26 の Frontend Weekly で取り上げた記事や話題を紹介します。 取り上げた記事・話題 Node v20.6.0 (Current) | Node.js Node.js v20.6.0 のリリースブログです。.env ファイルのビルトインサポートや import.meta.resolve がフラグなしで利用可能になる等の更新が行われています。 Chakra, Panda and Ark -
Wumpus Season In this post series we'll walk through recreating the classic Hunt the Wumpus game in Yew. The original was played at the command line, we're going to use a webpage. Yew allows us to define our frontend in Rust. Our app will be compiled to WebAssembly for execution. Does this app need this? No. Does any app need this? Debatable, but probably. Hash it out in the comments! Will we do i
Custom UI made easy with simplicity and total freedomXtend UI is a powerful frontend library of Tailwind CSS components enhanced by vanilla js. It helps you build interfaces with advanced interactions and animations.
はじめに Merpay のフロントエンドエンジニアの @tokuda109 です。 11月26日に Frontend Tech Talk vol.3 が開催されましたので、当日の発表の様子を簡単に紹介します。 create own CMS from scratch まず最初の発表は Merpay の @sottar_ による「create own CMS from scratch」です。 従来はキャンペーン用のページを作成する際にコーディングを行う必要があり、1ページ作成するためにも多くのリソースを必要としていました。 そこで社内でCMSの開発を行いGUI上でページの作成からリリースまで完結するようなフローを設計し、業務の効率化を行ったという発表でした。 speakerdeck.com ※ 資料は別の発表で使ったものですが内容は同じです CSS Architecture on Vue.js
Frontend Design, React, and a Bridge over the Great Divide Frontend designers create the HTML, CSS, and presentational JavaScript code that powers web products’ user interfaces. I see frontend design as helpful mortar that bridges the gap between design and development. Of course “frontend designer” may or may not be the right title for it. Some others titles that companies use are: UI developer C
reddit の Rust コミュニティーに template-rust-backend-with-electron-frontend のリリースについてポストしたところ、主に2つ、 Tauri と NEON について話題になりました。( up-vote たくさんとちょうど使いたかったんだありがとう的なポストも頂きました。幸いです。 ) `template-rust-backend-with-electron-frontend` released : rust 1. Tauri vs. Electron ( 間接的には template-rust-backend-with-electron-frontend にも関連します ) こちらは template-rust-backend-with-electron-frontend にとっては via via 的な間接的でややオフトピックよりな感
エンジニアと立ち話。Vol.43 @kazu69(メルカリFrontendエンジニア)ちょっとお話いいですか? メルカリで働くソフトウェアエンジニアに、ちょこっとお話を聞いていく本シリーズ。第43回では、メルカリ福岡開発チームのFrontendエンジニア@kazu69にちょこっとお話を聞きました。 「お客さま体験向上」のため、お問い合わせ機能などの開発を行っている福岡開発チーム。そのなかでおもにCS(Customer Service)メンバー向けのツールを開発している@kazu69がメルカリに入ったきっかけは?メルカリ初の他拠点開発として働いてみた感想は?聞き手は、同じく福岡開発チームのエンジニアリングマネージャー@vary3です。 コーヒーを淹れているところへ「ちょっとお話いいですか!」 @vary3:お、@kazu69さんじゃないですか!コーヒー、おいしそう!ちょっとお話いいですよね?
Weekly Frontend News 2022年4月3週目/react-testing-libraryにrenderHookが追加、など 寒くなったり暑くなったりして大変ですね。体調にお気をつけて。 自分が今週見たフロントエンド記事のまとめ。 react-testing-libraryにrenderHookの追加、react-hooks-testing-libraryが非推奨へ react-testing-library v13.1でrenderHookが追加された。 これにより、react-hooks-testing-libraryの大部分の機能がカバーされるので、react-hooks-testing-libraryを非推奨としてアーカイブする予定とのこと。 RFC: New Bundler in Gatsby Gatsbyがwebpack以外のバンドラーを模索中とのこと。 さまざ
11 Must-Know FrontEnd Trends for 2020 の翻訳です 2020年 11 の知っておくべきフロントエンドトレンド - 昼食で、スマートにフロントエンドの会話をする方法 チームのランチトークでスマートに話すことは、最新のフロントエンドトレンドを常に最新の状態に保つ大きな理由です。 それはあなたがより良い開発者になり、より良い技術とより良い製品を構築するのに役立つかもしれません。 多分。 それで、いくつかの興味深い方向にあなたを向けることによって、この名誉あるクエストをより簡単にさせてください。 A 〜 Z のすべての概念を説明するわけではありませんが、その概念、それがどのように有用であり、さらなるリソースにつながるかを紹介します。 たとえば、 Micro Fontends 、 Atmoic Design 、 Web コンポーネント TS take-over 、
A process to break the chains of old, and usher in an age of less complexity, greater consensus, and a more functional technical stack. As engineers, we often judge architectural decisions solely by their technical correctness. We can be quick to reach for metrics on performance, consistency, or availability because these are measurable and readily available. However, the most technically ideal so
こんにちは!サイボウズ株式会社フロントエンドエンジニアのおぐえもん(@oguemon_com)です。 はじめに サイボウズでは毎週火曜日にFrontend Weeklyという「一週間にあったフロントエンドニュースを共有する会」を社内で開催しています。 今回は、2023/11/07のFrontend Weeklyで取り上げた記事や話題を紹介します。 取り上げた記事・話題 Deprecation of formatting rules 2023/11/03リリースのeslint v8.53.0からスタイルフォーマット系のルールがdeprecatedになりました。メンテナンスの負荷軽減が主な理由です。 本バージョンではarray-bracket-newlineをはじめとする67のルールがdeprecatedの対象になっています。 Jest v30.0.0-alpha.1 Jestの次世代バージョ
最近初めてNext.jsを触ったのですが、レンダリング方法が色々ありすぎて混乱したので、調べてみました。 似たような3文字の略語多すぎ、、、 WEB+DB PRESS vol.123 でNext.jsのレンダリング方法の使い分け方が特集されていたので、その内容をまとめました。 勉強会の目的はレンダリング方法の違いを理解して、状況によって適切な使い分けができるようになること、です! 目次 SSR, CSR, SSG, ISG, ISR ってそもそもなんじゃ? それぞれでNext.jsのTodoアプリ作ってみた 実装、使い分け方、メリットデメリット CSR, SSR, SSG,( ISG, ISR) ってそもそもなんだっけ? レンダリングを行う場所とタイミングの話です。 サーバー側でレンダリングするか、クライアント側でレンダリングするか。 ユーザーリクエストの前にレンダリングするか、リクエスト
コンテンツCompat2021: Eliminating five top compatibility pain points on the web 共有者: sakito Compat2021という取り組みの紹介記事になります。 同時にマイクロソフト、IgaliaからもCompat2021についての各社の取り組みについて記事が公開されています。 WebDNAなどを通して行われてきた調査で浮き彫りになった開発者が感じている問題について「ブラウザーの互換性」が多くあがっており、その問題について改善していくという内容になっています。 特にCSS関連でCSS Flexbox, CSS Grid, CSS position: sticky, CSS aspect-ratio property, CSS transformsが各ブラウザで微妙に挙動が異なることによる辛さが多く挙げられているので、ここ
The Best Newsletters to Subscribe to for a Frontend Developer As web developers, we (obviously) help create the web. So it should come as no surprise that we have an inordinate amount of blog posts, articles, and links created on the web every week related to web development. Keeping up can be tough. One of the tools I use is to subscribe to newsletters, but there are a lot of those too! In this p
Web page load times and responsiveness to user action in web apps is a primary driver of user satisfaction–and both are often dominated by network latency. Latency itself is a function of the user's connection to the internet (Wifi, LTE, 5G), how far away the server is that the user is connecting to, and the quality of the network in between. While the latency numbers may seem low by themselves, t
Announcing Deno Queues など : Cybozu Frontend Weekly (2023-10-03号) こんにちは!サイボウズ株式会社 フロントエンドエキスパートチームの @mugi_uno です。 はじめに サイボウズ社内では毎週火曜日に Frontend Weekly と題し「一週間の間にあったフロントエンドニュースを共有する会」を開催しています。 今回は、2023/10/03 の Frontend Weekly で取り上げた記事や話題を紹介します。 取り上げた記事・話題 vite-plugin-ssr が Vike にリネームされた vite-plugin-ssr が Vike にリネームされました。機能的な変化は特になく、名前が変更されただけのようです。公式ドキュメント上にも Functionally, nothing changes: it's just
next-cms-ghost The fastest React frontend for headless Ghost CMS. Create and publish flaring fast blogs with next-cms-ghost. Powered by the React framework Next.js and content fed by headless Ghost, you’ll get a production ready hybrid frontend that combines the best of static and server-rendered sites. Most importantly, your website can be easily distributed globally to be served from the edge. A
コンテンツWe rendered a million web pages to learn how the web breaks 共有者:b4h0_c4t Web ページがどのようにして壊れるかを学ぶため、実際に発生しているエラーを調査、考察した記事。 トップ 100 ドメインのルートページ 100 万件をレンダリングするスクリプトを使用して出力される未処理エラーを調査した結果、85%が ReferenceError TypeError SyntaxError 。 また、上記のエラーが実際に発生している理由として、そのほとんどがリソースの読み込み失敗に起因していると述べています。 How to resolve ReferenceError ReferenceError の多くはライブラリが生成したグローバル変数を読み込む時に発生している。 What causes TypeError on
Airframe RPC is an open-source framework for building RPC services, using Scala as a unified RPC interface between servers and clients. Why Airframe RPC?Airframe RPC enables calling Scala methods at remote servers. You don’t need to worry about how to encode your data into JSON, nor how to define HTTP REST endpoints. Airframe RPC abstracts away these details; the framework generates code for seria
こんにちは! サイボウズ株式会社フロントエンドエキスパートチームの Saji (@sajikix) です。 はじめに フロントエンドエキスパートチームでは毎週火曜日に Frontend Weekly という 「1 週間の間にあったフロントエンドニュースを共有する会」 を社内でに開催しています。 今回は、2023/01/10 の FrontendWeekly で取り上げた記事や話題をまとめたものになります。 取り上げた記事・話題 Next.js 13.1 がリリース Next.js 13.1 がリリースされました。主要なアップデートは以下の通りです。 app ディレクトリを使った際の初回の JS の読み込みサイズ減少 next-transpile-modules で行ってたモジュールのトランスパイルの機能が本体に組み込まれた Edge Runtime が stable に Turbopack
こんにちは。メルペイのフロントエンドエンジニアの@tokuda109です。 この記事は、Merpay Advent Calendar 2023 の15日目の記事です。 Merpay Advent Calendar 2020 の「Merpay Frontend のこれまでとこれから」という記事で、メルペイのフロントエンドチームが2020年までに取り組んできたチーム組成やプロダクトの品質改善の話が紹介されました。(以下、前回の記事) 早いもので前回の記事が公開されてから3年が経ち、当時からチームの状況は大きく変わり、チームメンバーの人数が半数以下になるという危機的状況も経験しました。 この記事は、前回の記事の続編として、2020年以降にフロントエンドチームが取り組んできたことを紹介すると共に、危機的状況を乗り越えた経験から長期的に安定したチーム運営を行う上で重要だと感じたことを説明します。 M
Webアプリの主流がCSRからSSRに?など : Cybozu Frontend Weekly (2023-02-07号) こんにちは!サイボウズ株式会社フロントエンドエキスパートチームの nus3 です。 はじめに フロントエンドエキスパートチームでは毎週火曜日に Frontend Weekly という「1 週間の間にあったフロントエンドニュースを共有する会」を社内で開催しています。 今回は、2023/02/07 の FrontendWeekly で取り上げた記事や話題を紹介します。 取り上げた記事・話題 Typewind Tailwind CSS のユーティリティクラスを type-safe に扱えるライブラリです。Zero Bundle Size や tailwind.config.js をベースに型を生成する点、エディタの拡張が必要ない点、また、Next.js や SolidSta
When building in a strongly-typed language such as rust it's a shame to have to throw this strictness away, especially when dealing with the wild west of frontend stacks. The bigger the project is, the more you want to keep things cohesive. This cohesion evaporates quickly when you need to pass language barriers. While normal JavaScript does not have types, we can utilise TypeScript to share this
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く