あるSEのつぶやき・改

ITやシステム開発などの技術に関する話題を、取り上げたりしています。

2019-01-01から1年間の記事一覧

2019年の「今年の抱負」振り返り

2019年は珍しく「今年の抱負」なるものを書いてみました。 令和元年から始めたとなると分かりやすいので、今後も継続していきたいものです。 www.aruse.net では振り返ってみます。 ■目標1 ・定期的に運動を行い、年末までに体重を5kgは減らす。 今年の…

Fix)Unable to resolve "react-native-gesture-handler" from "node_modules/@react-navigation/native/src/Scrollables.js"

React Native + Expo を実行していると以下のようなエラーが表示されました。 Unable to resolve "react-native-gesture-handler" from "node_modules/@react-navigation/native/src/Scrollables.js" 解決策は、react-native-gesture-handler をインストール…

React Native+Expo+NativeBaseのAndroidでヘッダーが通知バーに覆いかぶさってしまう現象の解決方法

React Native + Expo + NativeBase のアプリで、Android の場合にヘッダーが通知バーに覆いかぶさってしまう現象が発生しました。 解決方法は簡単で、app.jsonに以下の記述を追加するだけです。 "androidStatusBarColor": "#334393", "androidStatusBar": { …

React Native+Expo+NativeBaseのプロジェクトを関数ベースで作成してみる

はじめに React Native (+ Expo) で使用できる NativeBase という見目麗しいライブラリがあるのですが、公式の Expo のセットアップサンプルが、React.Componentベースなので、関数ベースに書き換えてみます。 なお、言語は TypeScript とします。 nativebas…

React Native+ExpoでESLintとPrettierを使いコードチェックとフォーマット整形を行う方法

はじめに React Native + Expo の開発を行おうとして、そういえば React のプロジェクトで ESLint と Prettier を導入したけど定型化しておらず再利用ができないなぁと思いました。 じゃあ、React プロジェクトの ESLint と Prettier の設定を React Native …

Xcodeが "The package “MobileDeviceDevelopment.pkg” is untrusted." エラーで起動しない場合の対処方法

久しぶりにXcodeを起動しようとしたら、コンポーネントのインストールが要求されたのでインストールしたら見事に失敗しました。 エラーログにはこんな情報が。 2019-11-17 16:17:24+09 MBP Xcode[90584]: Package: PKLeopardPackage

AWS SESで検証メールがS3に届かなかったケースの対処方法

AWS

タイトルの通りなのですが、AWS SES で Route 53 で SPF の設定を行うと、MXレコードがデフォルトで以下のものになります。 10 feedback-smtp.us-west-2.amazonses.com これが罠で、実際は以下のようにしないと S3 にメールが届きません。(リージョンは各自…

Firefoxでリダイレクトがキャッシュされてしまった場合の解消方法

Firefox はリダイレクトされたサイトがあると、それをキャッシュする親切機能があるようです。 ですが、開発時にリダイレクトを止める場合などには、原因不明のリダイレクトが発生してしまう問題があります。 実際、これにドハマリしました。 キャッシュされ…

HugoのサイトをGitHub/Bitbucket経由でAmplify(CloudFront)で公開する方法

Hugoは静的サイトジェネレーターとして有名ですが、CloudFront で公開するにはなにかと手間がかかっていたようです。 ですが、現在は GitHub/BitBucket/GitLab/AWS CodeCommitでソース管理していれば、Amplify Consoleを使用することで簡単にCloudFrontにデ…

Reactでi-mobileの広告を表示する方法

React で i-mobile の広告を表示するのは一筋縄ではいきません。 自分もかなり苦労して広告を表示させることができました。 この記事は、i-mobileから提供されたスクリプトをそのまま使用していますが、ある時点での i-mobile の表示方法であり、将来に渡っ…

Reactで<script>タグを生成しスクリプトを実行/外部スクリプトを読み込む方法

React に限った話ではないかもしれませんが、JavaScript(TypeScript)で <script>タグを動的に生成してスクリプトを実行したい、もしくは外部スクリプトを読み込みたいことは結構あると思います。 外部スクリプトを読み込む方法はネットを探せば結構見つかるのですが</script>…

ReactでJSONファイルをブラウザから直接ダウンロードさせる方法

React のような SPA (Single Page Application) では、変数から直接 JSON ファイルを出力したいことがあります。 そんなときには、以下のスクリプトを試してみてください。 const fileName = 'finename.json'; const data = new Blob([JSON.stringify(export…

Docker+CentOS8にWordPressをインストールする

はじめに 前の記事では、Docker + CentOS 8に、nginxのコンテナ、php-fpmのコンテナ、MySQL のコンテナを構築して、連携して動作させる方法をご紹介しました。 www.aruse.net この記事では、この環境に若干手を入れて、WordPress をインストールする方法をご…

WordPressのwp-config.phpをコマンド実行だけで定義する方法

WordPress の wp-confg.php を設定する際、コマンド実行だけで設定ができると Docker などで自動化ができるのでうれしいですね。 この記事では、WordPress の wp-config.php をコマンド実行だけで設定する方法をご紹介します。なお、動作確認環境は CentOS 8…

Docker+CentOS8にnginx,PHP,MySQLをインストールしたコンテナを作成する

はじめに 前の記事では、Docker + CentOS 8 に nginx と PHP(php-fpm)をインストールしたコンテナを作成しました。 www.aruse.net この記事では、さらに MySQL を Docker + CentOS 8 にインストールしたコンテナを作成して、nginx と PHP(php-fpm)のコンテナ…

Docker+CentOS8+nginxにPHP(php-fpm)をインストールする

はじめに 前の記事では、Docker に CentOS 8 と nginx をインストールする方法をご紹介しました。 www.aruse.net この記事では、さらに PHP(php-fpm) のコンテナを構築して、Web(nginx) + App(PHP) という構成の環境を構築します。 はじめに フォルダ構成 ng…

Docker+CentOS8にnginxをインストールする

はじめに 2019年9月24日に、ついに CentOS 8 がリリースされました。 CentOS 8では、yumコマンドが廃止されdnfコマンドが採用されました。その他にも変更点が多いです。詳しくは下記記事を参照してください。 xn--o9j8h1c9hb5756dt0ua226amc1a.com この記事…

『フロントエンド実装工数をなるべく下げるための本』はフロントエンドエンジニアの苦悩が伝わる本だった。 #技術書典

『フロントエンド実装工数をなるべく下げるための本』なる本を技術書典7で入手し、読了したのでその感想などを書いてみます。 本書はBOOTHでの販売は現時点(2019/09/29)ではありませんが、とらのあなで販売しているのを見つけました。BOOTHでも扱って欲し…

『入門!実践!サーバーサイドKotlin』はKotlin+Spring Bootの入門に最適な本だった #技術書典

個人的に、Kotlin は今後10年で Java に置き換わる存在だと考えています。 静的型付け、型推論、Null 安全といった、Java では一部不足している機能をサポートしているだけではなく、高い生産性が出せるように文法も Java より簡潔になっています。それでい…

『React x Amplify で始めるサーバーレス アプリケーション開発』が分かりやすくてよい本だった #技術書典

技術書典 7で頒布されていた『React x Amplify で始めるサーバーレス アプリケーション開発』という本があったのですが、技術書典当日は気が付かず、BOOTH にて販売されているのを発見して速攻でポチりました。 booth.pm これですよ、これ。これが欲しかった…

技術書典7に行ってきた。エンジニアには最高の祭りだね。 #技術書典

本日、2019年9月22日(日)に、技術書の祭典である技術書典7が開催されました。 techbookfest.org 今回から池袋サンシャインシティの2Fと3Fの展示ホールCとDという、前回の倍になるスペースが確保されました。しかも、サークル数が640というとんでもないことに…

React+AmplifyのCognito認証画面に独自カスタマイズした画面を使用する方法

はじめに Amplify + Cognito のサインイン画面は堅牢でよくできているのですが、いかんせんデザインの自由度が低いです。 この記事では、 Amplify の API を直接叩いてサインインする方法をご紹介します。 はじめに 準備 出来上がりの画面 ソースコード 解説…

はてなブログを開設してから1年経ちました

はてなブログから、はてなブログを開設してから1年経ったよ、おめでとうメールが届きました。運営からのこうした連絡は悪くないですね。 1年前はココログがどうしようもないほど使いづらくなってしまったので、過去の資産を捨てる思いではてなブログに来ま…

Spring Boot入門のすばらしい記事を見つけたので紹介してみる

Spring Boot に入門するのって範囲が広すぎてなかなか難しいなと思っています。 ですが、そんな困難に光明が差すような Spring Boot (Spring Framework) の入門記事が Qiita に上がっていました。 Spring のすばらしい入門記事 qiita.com Spring Boot の基本…

React Native+ExpoのプロジェクトをejectしてiOS/Androidで起動するまで

React Native + Expo のモバイルアプリ開発は強力で生産性がすばらしく高いものの、Expo で用意されている機能を超えて、ネイティブのモジュールをリンクしたいとなると Expo での開発が続けられなくなってしまいます。 その際、Expo のプロジェクトを eject…

(Solved)Error running `xcrun simctl openurl booted exp...

I faced following error when I ran react-native run-ios. My project was ejected from Expo. Error running xcrun simctl openurl booted exp3ef760b8379f42f08ed322d17da22973://127.0.0.1:19000: An error was encountered processing the command (do…

(Solved)React Native:INSTALL_FAILED_INSUFFICIENT_STORAGE

I faced bellow error when I ran expo project which was ejected. FAILURE: Build failed with an exception. What went wrong: Execution failed for task ':app:installDebug'. com.android.builder.testing.api.DeviceException: com.android.ddmlib.In…

(Solved)Error: Activity class {host.exp.exponent/host.exp.exponent.MainActivity} does not exist.

I ejected Expo project and ran react-native run-android command, then bellow error happened. Error: Activity class {host.exp.exponent/host.exp.exponent.MainActivity} does not exist. In Expo project, run command is not react-native run-andr…

(Solved)React Native:エラー: シンボルを見つけられません:import androidx.annotation.Nullable

React Native + Expoのプロジェクトを、expo ejectしてreact-native run-androidをしたところ、以下のエラーが出力されました。 /Users/xxxxx/Projects/ejecttest/node_modules/expo-constants/android/src/main/java/expo/modules/constants/ConstantsServi…

自動テストにおけるモックとはなにか

新規開発プロジェクトで自動テストを行っているのですが、「自動テストにおけるモックとはなにか」について理解が今ひとつできなかったので調べてみました。 モックとはなにか、に踏み込むと関連するややこしい内容が出てきますが、この記事ではできるだけ単…