Micro Frontend Architecture: Import chunks from another Webpack bundle at runtime Importing chunks from other Webpack bundles at runtime, using them as if there were always there — interleaved applications

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? TL; DR 案件ガチャで未経験分野の案件に参画し続け、使用する技術がどんどんモダンな方向に進みまくった結果としてフルスタックになることができたという話 未経験技術での仕事の話が来たときでも今できないからやらないという姿勢ではなく、積極的に挑戦することでスキルを身につけることができた フリーランスや受託の場合、フルスタックな人材であればあらゆる業務をこなすことができかなり有利だと思われる 新しい技術はプライベートに加えて業務中に学習して身につけるのがベスト。なぜなら週40時間もの時間をプログラミングに使うことができるから 未経験でもポー
お知らせ イベントページ内のフィードコメント投稿仕様を変更しました。今後、コメントの投稿は、イベントに参加登録(補欠・抽選を含む)しているユーザー、またはイベント開催関係者(管理者・発表者)のみ可能となります。参加登録をしていないユーザーで、イベントページに関する連絡や質問がある場合は、「イベントへのお問い合わせ」機能をご利用ください。 お知らせ 2024年9月1日より、connpassではスクレイピングを禁止し、利用規約に明記しました。以降の情報取得にはconnpass APIをご利用ください。APIご利用についてはヘルプページをご確認ください。 12月 10 【増枠】年の瀬に振り返る Figma & React コンポーネントでのサービス開発 SPACEMARKET Design & Frontend Meetup
Key Takeaways TypeScript enhances JavaScript development by boosting developer confidence, catching errors before they hit production, simplifying code refactoring, reducing the need for unit tests, and enhancing the coding experience in the editor. TypeScript’s type system adds readability and predictability to the code, making it more self-explanatory and reducing the risk of errors. It also fac
以下はSimon Holdorf( dev.to/ Twitter / GitHub )による記事、9 Projects you can do to become a Frontend Master in 2020の日本語訳です。 9 Projects you can do to become a Frontend Master in 2020 Introduction あなたがプログラミングの初心者であるか、既に経験豊富な開発者であるかにかかわらず、この業界では、急速な変化に追いつくために新しい概念と言語・フレームワークを学び続けることが必要です。 たとえばFacebookが4年前にオープンソース化したReactは、既に世界中のJavaScript開発者にとって第一の選択肢になっています。 もちろんVueとAngularにも多くのフォロアーがついています。 さらにはSvelte、Next
タイトルの通りになりますが、Firebaseの技術顧問/コンサルティングでお手伝いできるところを探しています。 具体的には... ・具体的には「副業」、業務委託としてお手伝いできる先を探しています。 ・開発がメインというよりは、技術顧問、コンサルティング的な仕事を優先して探しています。 ・特にFirebaseを使った開発の案件を探しています。 ・※「本業」に関しては既に転職活動を終え、次が決まりましたのでそちらでの募集はしていません。といった感じです。 Firebaseを使った開発での技術顧問、コンサルティングといった形でお手伝いしたいなと。 (良い条件であれば、開発メインの副業でも検討したいです。) 少し長くなりますが一読いただき、「依頼してみたい」、「ちょっと声かけてみたい」と思って頂けましたらご連絡いただけると嬉しいです! できること自分ができることやスキルセット、今までの職務経歴に
At React Conf 2019 we announced an experimental release of React that supports Concurrent Mode and Suspense. In this post we’ll introduce best practices for using them that we’ve identified through the process of building the new facebook.com. This post will be most relevant to people working on data fetching libraries for React. It shows how to best integrate them with Concurrent Mode and Suspens
はじめに 私がReactに出会い1年程度経過し、React自体にも大きな変化がありました。今回は、Reactの良さを知ってもらいたいと思い、筆を取りました。 また、改めて自分の中のReactの知識を整理しようというのがサブ目標です。何回かに分けて1つのアプリを作れる程度までを記事にまとめていきたいと思ってます。 筆者のステータスは以下の通りです React・Next.jsを使って簡単なアプリを作ったことがある アルバイトでSpringを使ったwebアプリの開発をしている(フロントはjQueryゴリゴリ) Reactに出会って使用するに至った経緯 概略: jQueryで地獄を見たためReactに救いを求めました。 前述の通りjQueryを良く使用していて基本は問題なかったのですが、画面項目が増え動きがリッチになるにつれ実装難易度やメンテナンス性に限界を感じてきました。 そこでたまたま出会った
Hatena-Textbook 2018学習日記(5) - GraphQL編 - $shibayu36->blog;のようにHatena-Textbookを用いて最近のモダンなWebアプリケーション開発の学習をしているのだけど、TypeScript + GraphQL + Apollo Client + Reactの部分でそれぞれの技術の基本知識を理解できていなかったので、エラーが起きたときに何から直したらよいかわからない状態になってしまっていた。 前回はGraphQLのクエリについて学んだ - $shibayu36->blog;でGraphQLを少し掘り下げたので、今回はApollo platformについてチュートリアル( https://www.apollographql.com/docs/tutorial/introduction/ )を行いながら学習を進めていった。 Apollo
🎊Reactの2種類の新フック「useTransition」と「useDeferredValue」を最速で理解する(プレビュー版)JavaScriptReact 10月25日、Reactの新機能であるConcurrent Modeのプレビュー版が発表されました。この中には、Concurrent Modeの恩恵を得るために必要となる新しいAPIが含まれています。 これらのAPIの中心となるのが、Suspenseと2種類の新しいフックuseTransitionとuseDeferredValueです。この記事ではこの2種類のフックに焦点を当てて、これらが何をしてくれるのか、どのようにこれらが新しいのかを解説します。 要するに、Reactの公式ドキュメントを読んでまとめましたということです。特に、ガイドを一通り読んで理解しないとこれらのフックが何をしているのか理解しにくいため、最速で理解できるよ
What makes React Native the Future? A clear advantage of using React Native is it can help you build a native application without having to understand things like Objective-C, JavaScript, Kotlin or Swift. Apps can be developed for platforms such as iOS, Windows Phone, Virtual Reality headsets and helmets, and Android. React Native is a project of Facebook. Technology biggies like Tesla, Airbnb, Sa
日常的にVueを使用している開発者が、ReactとVueで全く同じアプリを作成した時のそれぞれの工程を比較して分かった相違点を紹介します。 特に、Reactのフックについて具体的な使い方が解説されています。 I created the exact same app in React and Vue. Here are the differences. [2019 Edition] by Sunil Sandhu 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 本記事は以前翻訳した記事の2019年Editionで、Reactのフックが追加されています。以前の記事は下記をご覧ください。 ReactとVueってどう違う?全く同じアプリをReactとVueで作成してみて分かった相違点 隣の家の芝生は青く見える ReactとVueで作成し
概要 かねてよりgRPCおよびgRPC-Webに興味があり、これを用いてシンプルなリアルタイムチャットサービスを制作し、公開した。 本稿では、その開発工程について解説する。 ゴール gRPC-Webを用いて「わいわいチャット」を作る。 https://waiwai-chat-2019.aanrii.com/ ※2020年9月現在、公開停止しました。 内容はシンプルなチャットアプリケーションだ。サイトを開くとまず過去ログが表示され、ほかの入室者の投稿が随時流れてくる。任意の名前で入室すると投稿欄が出現し、発言ができる。発言した内容はサイトにアクセスしている全員に、即座に共有される。過去ログは無限スクロールで遡ることができる。 フロントエンドはReactを用いたSPAとし、Netlifyを使って静的サイト生成・配信する。また、バックエンドはGKE上で動くNode.jsアプリケーションとし、かつ
最新フロントエンド技術の総復習! React Hooks、GraphQL、TypeScript、AMPなど紹介 - Bonfire Frontend #4 レポート こんにちは。 今年の4月にヤフー株式会社にデザイナーとして新卒入社した、三好 健太(@three4c)です。9月3日(火)にヤフーのセミナールームで「Bonfire Frontend #4」を開催しました! このイベントの目的はフロントエンドが抱える課題を共有し、フロントエンドについて熱く語る会です。 今回のテーマは「最新のフロントエンド技術 〜夏休み総復習〜」。初心者の方でも理解しやすい内容となっており、デザイナーの私も多くの知見を得ることができました。 ヤフーからは浜田と内藤が登壇し、ゲストスピーカーとしてサイボウズ株式会社より向井 咲人さん、株式会社ディー・エヌ・エーより吉井 健文さんにお話しいただきました。 これからは
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? この記事は、ある程度以上の規模のGUI開発において、React Hooks以後の宣言的UIにより、大規模開発に用いられる設計論に完全に対応できるようになり「ビジネスロジックの変更や追加」に対応するコストを低く保つこと(技術的負債の抑制)ができるようになったことを解説するものです。 技術的負債の抑制には、技術的負債の原因となりがちな「広範囲の密結合」と「適切な疎結合を保つ仕組みの欠如」が欠かせません。それをカバーするのが、大規模開発をクリーンに行える設計論(ここでは「現代的な設計論」とよぶもの)です。クリーンアーキテクチャなんかでGUIに
id:daido1976 です。入社してからあっという間に1年が経っていました。 直近3ヶ月ほどプライベートでフロントエンド開発の勉強をしていたのですが、ここ数年で CSS の Grid や React の Hooks が新しく導入されたことなどもあり、少し古いコンテンツだと教材として役立たない1 と感じることが多かったので、本記事では私が実際にやってみた中で 2019年時点で オススメできると判断した教材や学び方を皆さんにご紹介したいと思います。 はじめに やったこと JavaScript MDN の JavaScript の部分を読む & 手を動かす JavaScript Primer を読む YouTube 動画で Promise を学ぶ デバッグ方法を学ぶ React React 公式のチュートリアルを2周する egghead.io の動画で Redux を学ぶ ヘルシンキ大学の
フロントエンドの特定技術について語る解説は多くあれど、そもそもフロントエンドのつくりかたについて語った解説は多くないのではないでしょうか。 フロントエンドという大きな領域ですので恐れ多くもありますが、私が GUI プログラミングに携わった経験をもとにお話した内容のスライドとその補足をここでしたいと考えます。 スライド スライドのページ数は多いですが、差分がほとんどですので、それほど構える必要はないです(カーソルキーに負担がかかるという問題を除いて)。 補足解説 大きなテーマごとに補足をしていきます。 スライドで取り上げているテーマは次の4つです。 GUI アーキテクチャパターン データの同期 エラーハンドリング コンポーネント構造 「GUI アーキテクチャパターン」はいわゆる MVC や MVP といわれるものがどういったものかを解説する章です。 「データの同期」は画面と実際のデータが離れ
はじめに Reactを中心としたフロントエンド開発において、以下のような構成を見かけることが多いと思います。 UIライブラリとしてReact 型のある言語としてTypeScript スタイル定義としてstyled-components コンポーネントの開発環境としてStorybook LinterとしてESLint FormatterとしてPrettier この記事では、各種ライブラリについて紹介したのち、それらを使う場合の環境構築についてハンズオン形式で説明します。 ※ アプリケーションを開発する際に必要になる設定が抜けていたので、追記しました。 各種ライブラリの紹介 まず、各ライブラリがどのようなものなのかを簡単に紹介します。 ライブラリの使い方などは公式ドキュメントなどを参照するようにしてください。 React ドキュメント ReactはUI(ボタンやフォームなど)コンポーネントを作
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く