GitHub - ReactNativeNews/React-Native-Apps: Curated List of Open Source React Native Apps. Curation curtesy ofYou 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
Jestなどを使わずにスナップショットテストを書く
次のようなテストコードを書きます。(これはMochaを使っていますが大体どんなテストフレームワークでも同じことが出来ます。) 次のスナップショットでは、transformというJSONを入力に受け取り、JSONを出力する関数をテストしています。 snapshot-test.js: const fs = require("fs"); const path = require("path"); const assert = require("assert"); const fixturesDir = path.join(__dirname, "snapshots"); // transform function const transform = require("../transform"); describe("Snapshot testing", () => { fs.readdirSy
個人開発者の欲求5段階説 - NOT SO BADなブログ
個人開発者の欲求5段階説Jan 07, 2019 意識低い個人開発論ポエム言いたいだけ以前に「死なないWebサービスの作り方」みたいな記事を書いたところ、ありがたいことに最近は個人開発の相談をいただいたりすることも出てきました。（おそれ多い！） しかしすごく当たり前の話なんですが、個人開発者と言ってもステージはいろいろだし、そもそも目指すところが違ってたりもします。その前提によってアドバイスする内容も全然変わってくるなと。 自分が個人開発でいま何を目指していて、そのために何をするとよさそうなのか。 その辺りの会話の叩き台として、ざっくり整理してみようというのがこの記事の目的です。 半分以上タイトルを言いたかっただけなので、軽い気持ちで見てもらえたら幸いです。 前提と言い訳みんな大好きマズローさんみんな大好きマズローさんの欲求5段階説。あらゆるところで引用されまくってるのでもはや説明は不要で
わりとドライな、人生への投資とコスパの話｜深津 貴之 (fladdict)
コスパで考えた、人生のポイント配分について。 こういうのを書くと、「人生をコスパで決めるな」という声もあるけれど…それはそれで間違い。 人生において優先順位の低いものを、コスパで処理するとどうなるか。逆に、自分にとって「本当に大事なこと」を、コスト無視してトライできようになる。 そのためには、まず自分の投資する分野が、どのようなコスパのカーブをとっているか。それを理解することが大事だ。 ルール1. 一般的には高レベルほどコスパが悪くなる世の中の大半のものは、高レベルになるほどレベルアップがしんどくなる。これは学習だけの話ではない。投資でも経営でも幸せでも8割ぐらいはそう。ドラクエとかのレベルと同じ。 英語歴が1週間と1年では、スキルに大きな差がある。一方で英語歴20年と21年では、ほとんど差がない。スキルに習熟するほど、このコストパフォーマンスは悪くなっていく。 このため、人生をかけたメイ
だれも教えてくれない、はじめてのテレビCMでやるべきことリスト｜takejune
📺 スタートアップとテレビCMWebサービスやアプリのテレビCMも今では珍しくないけれど、設立後数年の未上場ベンチャーが当たり前のようにそれをやるようになったのは、ソーシャルゲームが生まれ、スタートアップが資金調達しやすくなったここ数年の話です。 歴史が浅く、PDCAを回している会社が限られていることもあってか「CMの知見」はスタートアップの間であまり出回っていません。直近でCMを実施した某社も「知らなかった」というだけでずいぶんな苦労をしたようです。そのような情報格差をなくすためにも、僕がフリル(ラクマ)でCMを打ち続けて得られたことを、できる限りシェアしようと思います。 このエントリは、個人の経験/主観/バイアスに基づいた「知見」を書いているので、その前提で読んでください。 📖 目次1. コストについて 2. クリエイティブについて 3. サービス運用について 4. 成功指標につい
いつも「時間がない」あなたに 欠乏の行動経済学 - hitode909の日記
リソースが足りない状態の人間について研究した本。そのリソースは時間だったり資金だったりする。 スラック、つまり余裕があることが大事で、100円のおやつとか買うとき、それによって財産が100円減ることを考慮する人は居ない、毎月使えるスラックから支払われることになる。しかし、本当に切羽詰まってると、少しのお金を作るために借金し、次の入金は利子の返済に当てることになる。 人間、気になることがあると、判断に使うためにリソースを奪われていって、能力が下がっていく。貧しい状態の人は生まれ持った能力が低いわけではなく、お金や時間の心配をしていることで能力が下がっていくことが実験によって確かめられている。という本。 現代日本で考えると、テレビに繋いでるレコーダーが残り1時間とか3時間とかで、毎日、次の番組を録画するために、歌まつりを早送りで見続けたり、古いバラエティ番組を消すかどうかで議論したりして時間を
pixiv chatstoryのiOSアプリをReact Native（Expo）でリニューアルしました！ - pixiv inside
こんにちは、福岡オフィスでpixiv chatstoryの開発を担当しているtawachan（@tawachan39）です。 前回「デザイナーでも書けるReact Native」と題して、React Nativeでの開発模様を書かせていただいたのですが、先日無事リリースをすることができました（！）ので、今回はその小話を書いていければと思います。 特に、React Nativeでアプリを作ることに興味があったり実践登用することを検討している人にとって参考になることがあれば幸いです。 リニューアルのきっかけ pixiv chatstoryは既存のSwiftで書かれていたアプリをReact Nativeで書き換えるだけでなくデザインのリニューアルも行っていました。そのきっかけや経緯について簡単に紹介します。 Swiftのコードをメンテナンスするのが大変でWebの技術で置き換えたかった 現在のpi
ベストプラクティスを見つけるためのReact Nativeアプリ ソースコードリーディング - KitchHike Tech Blog
良いアプリを作るために、良いコードを読む。 CTOの Shoken です。キッチハイクでは2年前にRailsへのReact導入、1年半前に0からReact Nativeでアプリ開発を始めました。この記事では、React Nativeアプリ開発のベストプラクティスを見つけるためのソースコード探索手法と、コードリーディングのポイントを紹介します。 良いアプリを作るために、良いコードを読む。 React Nativeアプリのソースコードの探し方 ReactNativeNewsのShowcase, React Native Appsから探す F8 2017 PxView React Docs ( React公式ドキュメント ) から探す react-nativeリポジトリのRNTesterを読む ライブラリのサンプルアプリのコードを読む コードリーディングのポイント ディレクトリ構成 使用している
FigmaではじめるUI（Web）デザイン｜Part1｜Nao Komura｜note
Figma 3.0が発表されてから半年ほど経ち、実際にプロジェクトでFigmaを使用した際の知見や、tips的なものまで日本でも散見されるようになってきました。 そんな感じで良い具合に枯れ始めているデザインツールではあるのですが、まだまだ日本での記事は、経験者向けに「Figmaに乗り換えるメリット」とか「他のUIデザインツールとの比較」のような内容の記事が多く（人のこと言えないですが......）、初心者にはUIデザインのツールとしてはまだまだ馴染みの薄いツールなのかなと思います。 というより、昨今はデザインツールが多すぎてシンドいことこの上ないですね。一度効率化の味を知ると更なる効率化を追い求めてしまいますし、そんな現状だと日頃から使用しているツールを変えるのも一苦労です。 ......さて、今回は初心者〜中級者くらいまでに向けてFigmaで作るUIデザイン入門的な記事を書いていこうと思
待ち時間の体験を向上させるスプラッシュスクリーン
Nickはロシアのセントピーターズバーグ出身のソフトウェアデベロッパー/ブロガーです。彼による他の記事はこちらをご参照ください。 ロード時間でユーザーを待たせないことは、モバイルUXデザインの基本です。モバイルのデザイナーはこの原則をよく知っているはずです。しかしロード時間の点ではユーザーの求める水準に応じることが難しいときや不可能なときがあります。どのような原因でローディング時間が遅くなるにせよ、待ち時間の障害を取り除き良いモバイルUXを目指すべきです。 スプラッシュスクリーンとは？ スプラッシュスクリーンとは、ユーザーがアプリを立ち上げたときに最初に見る起動画面のことです。ここにはアプリの名前、ロゴ、背景画像が含まれます。 スプラッシュスクリーンを活用して第一印象を向上させる 第一印象の94％はデザインと関係していることが広く知られています。悪いデザインは悪い印象を生み出します。初回の
GitHub Actions 入門 - 生産性向上ブログ
----- 2019/08/18 追記：GitHub Actions が新バージョンで大きく変わったため、新しい記事を書きました。こちらの記事は古い内容なので、新しい記事を参照してください。 www.kaizenprogrammer.com ----- developer.github.com 現在パブリックベータの GitHub Actions が自分も使えるようになったので、いろいろ調べたり動かしてみたりした内容をまとめます。 目次 注意事項 GitHub Actions とは 簡単な例 (Hello, World) ワークフローの設定 workflow ブロック action ブロック needs を使ったフロー制御 uses における Dockerfile の指定方法 ワークフローがサポートしているイベント 秘密情報の設定 GITHUB_TOKEN ビジュアルエディタ ワークフロー
突撃！ 弊社のpackage.json 〜eurekaを支えるJavaScriptライブラリたち〜 – Eureka Engineering – Medium
この記事はeureka Advent Calendar 2018 18日目の記事です。 そろそろ2018年も終わりかけですが、皆さんいかがお過ごしでしょうか。Webチームの竹内(a.k.a. BOXP)です。 もう今年も終わりということで、この記事では我々Webチームが今年新たに導入していったJavaScriptのライブラリを紹介がてら振り返りたいと思います。 目次1. normalizr2. reselect3. redux-thunk4. webpack-bundle-analyzer5. jest6. renovate最後に1. normalizrnormalizr はReduxやFluxのStoreに格納するデータの正規化を行うライブラリです。 抽象的な言い方をしましたが要するに同じIDを持つオブジェクトを簡単に共通化出来るもので、例えば以下のようにオブジェクトを正規化します Be
documentationjs + add-text-to-markdownでREADME.mdのAPIリファレンスを自動更新
documentationjs + add-text-to-markdownでREADME.mdのAPIリファレンスを自動更新 documentationjsはJSDocからドキュメントを生成できるツールで、ES2015以降のコードにも対応しています。 (TypeScriptは対応してないようです) 以前はMarkdownへの出力が難しかったのですが、いつのまにかdocumentation build -f mdでMarkdownでのAPIドキュメントが生成できるようになっていました。 これを使うことで、ライブラリを書いてそのJSDocからドキュメントを生成して、READMEのUsageセキュクションを自動的に更新できるようになっています。 以前もできたのですが、かなりトリッキーなテーマを書いたりしないといけませんでした。(後stdoutへの出力がなかった気がします) –theme for
業務で使える簡単なSSR + SPA のテンプレートを公開した - hiroppy's site
久しぶりのブログです。 よく Node.js の人と思われがちですが、普段は Node.js でのバックエンド開発はもちろんですが React や Vue を書いていますので、たまにはフロントエンドネタを投稿しようと思います。 GitHub - hiroppy/ssr-sample: A minimum sample of Server-Side-Rendering, Single-Page-Application and Progressive Web App A minimum sample of Server-Side-Rendering, Single-Page-Application and Progressive Web App - GitHub ... リポジトリにあるコード見たほうが早いと思いますので、ここでは注意点等を列挙していこうかなと思います。 主な技術スタック de
DroidKaigi2018で発表したFlutterアプリの話のスライド補足 - Konifar's WIP
DroidKaigi2018で『コードで見るFlutterアプリの実装』というタイトルで話をしてきました。 speakerdeck.com 聞きに来ていただいた皆さん、資料を読んでフィードバックをくれた皆さん、運営の皆さん、発表前に場を温めていただいた @mhidakaさん、ありがとうございました。 スライドだけだと話がわかりづらいところもあると思うので、書き起こし形式で補足しておこうと思います。当日用のスライドを一部削ったり、アドリブの台詞を省いたりはしています。 ちなみにこのやり方は、@yanzmさんが去年、今年にやっていてとてもよいなぁと思ったので真似させていただきました。 コードで見るFlutterアプリの実装 今日はFlutterアプリのコードの話をします。Flutter自体の内部の詳しい実装ではなく、Flutterでアプリを作る時にどうコードを書くのかという話です。よろしくお願
3 ways to test mapStateToProps and mapDispatchToProps
You already know that you shouldn't actually test the result of calling connect (the connected component) - as Redux already makes sure the behaviour of connect is correct. Instead, you test your wrapped component separately, by exporting it as a named export. But what about mapStateToProps and mapDispatchToProps? This is custom code that could have bugs. The Redux docs don’t really mention an off
React Native でアプリ開発をして良かったところ・ツラかったところ - BizReach Tech Blog
こんにちは。ビズリーチの新卒事業部でフロントエンドエンジニアをやっている円谷(@___35d)です。以前ビズリーチのデザイナーブログにも登場して、通勤風景の写真でチーム内で相当いじられました。興味ある方はぜひそちらも読んでみてください。今日はエンジニアブログの方を書いていきたいと思います。 さっそく本題ですが、2018 年 11 月に ビズリーチ・キャンパス for OB/OG がフルリニューアルされました。いままで WebView ベースで構築されていたアプリをリデザインし、React Native でフルネイティブ化しました。この記事では React Native を採用するまでに至った背景と、導入してどうだったのかについてお話できればと思います。この記事が、これから React Native を使ったアプリ開発を検討している方の参考になれば幸いです。 目次 はじめに 社内事情と技術選
ZOZOのグローバルECのフロントエンドアーキテクチャ設計 / Frontend Architecture Design of ZOZO - Speaker Deck
HTML5カンファレンス2018で登壇した内容です。
PWA導入の成果と課題 / nikkei-pwa-html5conf2018 - Speaker Deck
HTML5 Conference 2018 https://events.html5j.org/conference/2018/11/ で発表したPWAに関するスライドです。 [日経電子版 サイト高速化とPWA対応] https://speakerdeck.com/sisidovski/nikk…
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - benevbright/react-navigation-collapsible: An extension of react-navigation that makes your header collapsible.