はじめに キッチハイクのエンジニアメンバーでReact Nativeの気になるニュースを持ち寄ってみました！ はじめに React Native アドベントカレンダー 2021 M1 Mac + Xcode 12.5.1でReact Native 0.65 アプリのビルド時に出たエラーと対応 React Native で Liquid Swipe を実装するための4つの技術 React Navigation (V6)の設計方針に関するTips ニュースレター React Native Now React Native Advent Calendar 2021 に記事を投稿しました React …

はじめに キッチハイクのエンジニアメンバーでReact Nativeの気になるニュースを持ち寄ってみました！ はじめに React Native アドベントカレンダー 2021 Hermes がデフォルトになるために React Nativeへの最適化 Fabric用の新しいガーベッジコレクターの構築 パフォーマンス上の問題点を克服 垂直統合の先駆者 コミュニティ全体を巻き込む サマリ Recoil v0.5 release Hook for refreshing selectors Atom effect improvements Loadable factories JavaScript用…

はじめに キッチハイクのエンジニアメンバーでReact Nativeの気になるニュースを持ち寄ってみました！ はじめに React Native Japanコミュニティの1ヶ月 React Native Matsuri 2021のまとめ記事 React Native 0.66 リリースアナウンス ハイライト Nightlyリリース Commitlyリリース Shopify の複数アプリ間でのコード再利用について Expo 43 beta 大きなプロジェクトでTypeScript化を進めるための8つのtips NativeBase のご紹介 rn-css のご紹介 さいごに We're Hiri…

こんにちは、キッチハイクのtaiseiです！ キッチハイクでは定期的に社内勉強会を開催しています。 私も先日「最初にしりたい Tailwind CSS」というタイトルで発表をいたしました。 今回は発表スライドの共有とともに、発表の背景と要点のまとめを補足したいと思います。 スライドはこちらです。 speakerdeck.com 発表の背景 私は数多くある CSS フレームワークの中で、なぜ今 Tailwind CSS がここまで注目を浴びているのかに興味がありました。Tailwind CSS のインプットをしっかりとするまでは、「HTML の class に直接スタイルを当てることができる C…

こんにちは。エンジニアの小川です。 キッチハイクでは定期的に社内勉強会を開催しています。 先日は「ドメイン駆動設計のはなし」というタイトルで私が発表させていただきました。 speakerdeck.com 本記事では発表スライドの補足として発表の概要と個人的な考えについて記したいと思います。 発表について ドメイン駆動設計(以下DDD)とは、エリック・エヴァンス「ドメイン駆動設計」で提唱されている手法に端を発する、ドメイン(システムの対象領域)知識のソフトウェアの反映に焦点をあてた設計手法です。 本発表ではこのDDDについて以下のようにお話ししました。 ドメイン駆動設計の概要 Ruby / Ra…

はじめに キッチハイクのエンジニアメンバーでReact Nativeの気になるニュースを持ち寄ってみました！ はじめに React Native Japanコミュニティの1ヶ月 iOS 15, Android 12 に向けた準備 iOS 15 QuickType Bar Transparent Navigation Bar シミュレーター Android 12 Overscroll Effect Permission Updates React Nativeがマネージャー採用 React Nativeバージョンアップ情報 react-native 0.65.1 リリース react-nativ…

はじめに キッチハイクのエンジニアメンバーでReact Nativeの気になるニュースを持ち寄ってみました！ はじめに React Native Japanコミュニティの1ヶ月 React Native 公式ブログより8月3つの記事が公開 8/17 React Native 0.65 のアナウンス 8/19 React Native の2021年下半期 8/26 React Native's Many Platform Vision React Navigation v6.0 リリース Ｆ＆ＰジャパンがReact Nativeアプリをリリース レンダーがビジュアルでわかる記事 開発用アプリ、プ…

こんにちは、キッチハイクのtaiseiです！普段はデザインエンジニアとして、フロントエンドの開発をメインにおこなっています。 キッチハイクでは月に一回「わくわくテックラボ」という社内勉強会をおこなっているのですが、今回は社内LT大会を開催しました！発表者のスライドを通して、その内容をお届けできれば幸いです。 TypeScriptで学ぶジェネリクス taogawa 発表の背景 変性 アプリ申請用Macマシンのクラウド化にGitHub Actionsを選んだ話 tamago3keran 発表の背景 GitHub Actions を選択した3つの理由 画像と、Webの多様性と画像描画の技術とそれを支…

はじめに キッチハイクのエンジニアメンバーでReact Nativeの気になるニュースを持ち寄ってみました！ はじめに React Native Japanコミュニティの1ヶ月 React Native イベント React 18 に向けてのプラン React Nativeでのエラーハンドリング Azure Notification HubsでReact Nativeを使用してサンプルを作成できるようになった AWS Amplify がフルスタック CI/CD 機能をローンチ Re.Pack: Webpackベースのビルドツール Expo 42 React Native Expoを使用して、ス…

こんにちは、エンジニアのみほです！ キッチハイクでは定期的に社内勉強会を開催しています。 私も先日「React コンポーネントのスタイリング手法 これまでとこれから」というタイトルで発表をいたしました。 今回は発表スライドの共有とともに、発表の背景と個人的な考えを補足したいと思います。 スライドはこちらです。 speakerdeck.com 発表の背景 「デザインシステム」という言葉が浸透して久しいですが、よし、デザインシステムやるぞ！と意気込んだところで、技術選定をすんなり進めることはなかなか難しいと言えるのではないでしょうか。最近では Utility First (CSS) を掲げたライブ…

こんにちは。キッチハイクのタクです。 キッチハイクでは定期的に社内勉強会を開催しています。 私も先日「状態管理の歴史を振り返り Recoil の良さを知る」というタイトルで発表しました。今回は発表スライドの共有とともに、発表の背景、 Recoil の良さを補足したいと思います。 スライドはこちらです。 発表の背景 React や React Native を生み出した Facebook が、新たに Recoil という状態管理ライブラリを実装しています。 インターネット上で Recoil について調べると、 Redux と比較してのメリットがよく書かれています。しかし、キッチハイクでは Red…

はじめに キッチハイクのエンジニアメンバーでReact Nativeの気になるニュースを持ち寄ってみました！ はじめに React Native Japanコミュニティの1ヶ月 Coinbase の React Native 記事 2本 stand.fmアプリのパフォーマンス改善話「推測するな、計測せよ」 React 18 Alpha Automatic Batching Transitions Suspense & Streaming HTML, Selective Hydration React Native 0.64.2 Release 直近のiOS開発の動向 App Storeのレビュ…

こんにちは！デザイナの狩野です。 キッチハイクでは定期的に社内勉強会を開催しています。 先日は私が発表担当となり、「一歩ふみこむHTML&CSS」というタイトルで発表を行いました。 今回はそのときの発表スライドの共有と、発表に至った背景を記事にします。 スライドはこちらです。 speakerdeck.com 発表の背景 Web開発に興味が湧き、手始めにHTML, CSSの勉強から始めてみた、という方は多いのではないでしょうか。 私も、本格的にWebデザイナとして働き始めることを決めたとき、一番最初にお世話になったのはProgateのHTML/CSSコースでした。 ただ、一番最初に触れるケースが…

はじめに キッチハイクのエンジニアメンバーでReact Nativeの気になるニュースを持ち寄ってみました！ はじめに React Native Japanコミュニティの近況 React Native アプリのクリーンビルドコマンド React Native プロジェクトのクリーンアップを行うライブラリ iOSでのHermesパフォーマンス 決済サービス Stripe の React Native SDK stripe-react-native React Native でグラデーションを再現する キッチハイクのアプリ開発最前線 さいごに We're Hiring React Native J…

こんにちは！デザイナの狩野です。 今回は、キッチハイクのフロントエンドチームが取り組んだ自社サイトの PageSpeed Insights のスコアアップ施策についてご紹介します。 目次 目次 はじめに こんなひとにオススメ プロジェクトの進め方とうまくワークしたこと 1. まずは自学！そして経験者の話を聞く 2. スコアの仕組みを理解する 3. 目指すゴールと取り組むべき事項を明確にする 4. 「週一リリース、ふりかえり」 のサイクルの確立 取り組み結果 副次的に得られた効果 フロントエンドのより深い知識が身についた パフォーマンス改善の意義、本質を考えることができた もっとこうすればよかっ…

こんにちは。エンジニアの小川です。 キッチハイクでは定期的に社内勉強会を開催しています。 私も先日「IAMのきほん」というタイトルで発表をいたしました。 今回は発表スライドの共有とともに、発表の背景、IAMの学び方を補足したいと思います。 スライドはこちらです。 speakerdeck.com 発表の背景 発表の背景にはIAMを学ぶ上での第一歩がなかなかないのでは、という課題意識がありました。 IAMはAWSにおいてセキュリティを維持するうえで非常に重要でありながら、書籍などでまとまった分量が割かれていることはあまりないように感じています。 一方でIAMのアクセスキー / シークレットキーを奪…

PureComponent さえ使えばパフォーマンスを改善できるのか? パフォーマンスを改善したいとき、 PureComponent や React.memo を使うことがあると思います。しかし、 React の仕組みを理解していないと、 PureComponent などを使うだけでは不要な再レンダリングを制御できないことがあります。コードを読んで仕組みを正しく理解する大切さを改めて実感したので、知見を共有できればと思います。 はじめに こんにちは。 KitchHike エンジニアのタクです。 先日アプリの不具合調査で、不必要に再レンダリングが行われている箇所を発見しました。パフォーマンスへの…

はじめに キッチハイクのエンジニアメンバーでReact Nativeの気になるニュースを持ち寄ってみました！ はじめに React Native Japanコミュニティの近況 React Nativeアプリ 7つのベストプラクティス Sentryでパフォーマンス計測ができるようになった Recoil 0.2.0 Release Reactのベストプラクティスの提案をまとめた記事、Tao of React スター精密(株)がプリンター制御用SDKをRN向けに提供開始 今月の React Native ライブラリ紹介 React Native Hold Menu react-native-pape…

SSHの鍵管理は、セキュリティと利便性のトレードオフがある悩ましい問題です。AWSなど他サービスのアカウントが絡んでくるとなおさらです。今回はそんな悩みを、 AWS Systems Manager ( 旧称 SSM ) を使って、シンプルかつよりセキュアにしたお話をしたいと思います。 はじめに こんにちは。エンジニアの小川です。SSHの鍵管理はみなさんどのようにされているでしょうか？一般的には1ユーザーにつき、1つの秘密鍵 / 公開鍵のペアが常かと思います。ただ、この管理は厳密にしようとすると非常に悩ましい問題です。 キッチハイクではAWS Systems Managerが提供するSessio…

はじめに キッチハイクのエンジニアメンバーでReact Nativeの気になるニュースを持ち寄ってみました！ はじめに React Native Japanコミュニティの活動サマリー React Native 0.64 リリース Hermes opt-in on iOS Inline Requires enabled by default Hermes with Proxy Support React Nativeで機密性の高いユーザーデータを保存するためのアプローチ サンプルコード ユーザーデータを安全に保存するためのハイブリッドアプローチ 概要図 類似ライブラリについて OSSなReact…

はじめに キッチハイクのエンジニアメンバーでReact Nativeの気になるニュースを持ち寄ってみました！ はじめに React Native Japanコミュニティ React Nativeでの画像キャッシュの仕組み(iOS) React Native 0.64 と 0.63.5 JCenter のクローズによる影響 Redux・Context API・Recoil のパフォーマンス比較 Wix社のDetox運用ノウハウ リアルタイムエンゲージメントのプラットフォーム "Agora.io" Quoraの質問: 「ReactではなくFlutterを選択する理由は何ですか？」 中国生まれのRe…

はじめに キッチハイクのエンジニアメンバーでReact Nativeの気になるニュースを持ち寄ってみました！ はじめに KitchHike式 React Native 設計チェックポイント Wix のOSSプロジェクト運営 React Native アプリの多言語対応もこれで楽になる？ スケルトンUIを実装できるReact Native ライブラリ Inside the React Core team フロントエンドのツールチェインライブラリ Rome 個人開発者から見た React Native (2021) React Native を教えるプログラミングスクールが登場 Reactの状態管…

はじめに キッチハイクのエンジニアメンバーでReact Nativeの気になるニュースを持ち寄ってみました！ はじめに React Native Advent Calendar 2020 TECH STAND #2 React Native にLT登壇しました Flutter がWindowsデスクトップアプリに対応へ Wix Multi-Module architecture for React Native Base Web: Uberが開発したWeb ReactのUIフレームワーク React Server Components React Native 2020年の振り返り RN アプ…

キッチハイクでは先ごろAmazon Pay 新バージョン(v2)であるAmazon Pay Checkout V2(以下Amazon Pay CV2)をいち早くサービスの一部決済に導入しました。今回はAmazon Pay CV2の概要と、導入にあたっての考慮ポイントについてご紹介します。 はじめに こんにちは。KitchHikeエンジニアの小川です。 キッチハイクでは先ごろAmazon Pay CV2をサービスの一部決済に導入しました。 Amazon Payは知っているけど、CV2？何それ？と思われたかもしれません。 Amazon Pay CV2はAmazon Payの新バージョン(v2)です…

はじめに キッチハイクのエンジニアメンバーでReact Nativeの気になるニュースを持ち寄ってみました！ はじめに React Native Advent Calendar 2020 React Navigation v6 のロードマップをみんなで読もう iOS で Hermes を使えるようにするPRがマージされた React Nativeプロジェクトのディレクトリ構成紹介記事 React Native at Wix の連載記事が面白い React Native と Swift とのパフォーマンス比較 React Nativeのセキュリティに関する記事 さいごに We're Hiring…

はじめに キッチハイクのエンジニアメンバーでReact Nativeの気になるニュースを持ち寄ってみました！ はじめに React v17.0 リリース 新機能「なし」 大きな変更点はイベントデリゲーションに関するもの React 17 での破壊的変更は最小限に React Native でのサポート Facebook風なアプリ起動時のプレースホルダーをReact Nativeで Skeleton UI がかっこいい Reanimated 2 を使用したインタラクティブUI Node.js v15, npm v7 リリース Node.js のバージョニングについて Google Chrome …

はじめに キッチハイクのエンジニアメンバーでReact Nativeの気になるニュースを持ち寄ってみました！ はじめに React Native コンポーネントのスケルトン React Native と Flutter のレンダリングについて調べた RAM bundle フレンドリーな index.js を作成するライブラリ React Native Game Engine クールなRN製アプリのカタログ、madewithreactnative react-native-for-windowsで書かれたMicrosoft Store アプリ React Native アプリのパフォーマンス最適…

はじめに キッチハイクのエンジニアメンバーでReact Nativeの気になるニュースを持ち寄ってみました！ はじめに iOS14リリース Shopify が実践しているソフトウェア品質担保 Tophatting （トップハッティング）とは 要約 RNコミュニティ公式のReact Nativeライブラリ検索ページ React Native Directory React Nativeのメンテナーによるパフォーマンス改善のリンク集 Enable Hermes to work on iOS react native vs flutter iOSDC Japan 2020 が開催された リンク さい…

はじめに React Native v0.63 がリリースされましたね！ キッチハイクのエンジニアメンバーでReact Nativeの気になるニュースを持ち寄ってみました！ はじめに React Native v0.63 リリース react-native-network-logger 書籍 Effective React Hooks Tesla, Inc. が React Native エンジニアを募集 アニメーションのパフォーマンス比較：Flutter vs React Native vs Native A First Look at Reanimated 2 Apple Silicon搭…

はじめに キッチハイクのエンジニアメンバーで React Native の気になるニュースを持ち寄ってみました！書籍 React Native が発売されましたね！ 自分はReact Native Meetup #10に参加して応募したところなんと当選しました！いま読んでいるので、来月のRN Featuresで取り上げたいですね〜。 はじめに React Native Meetup #10 React Native ライブラリのサンプル動画付きギャラリー アニメーション付きで Dark mode に変わるスケルトンアプリ react-native-reanimate v2-alphaでAndr…