React Native

React Nativeから使うStability AI:画像生成APIの活用

1. はじめに

環境広場、今年はいちだんと賑やかでした。
クラウドソリューション開発部の寺谷です。会場で展示した子ども向け画像生成アプリは、気づけばブース前に小さな行列。タップひとつで絵が出るたび、「もう一回!」の連打コールで僕の腕も連打。
イベントの様子はこちらにまとめています。
今日はその心臓部 Stability AI を深掘りします。AIについて、料金、APIの使い方(React Native)、
そして日本語と英語プロンプト比較
まで一気にどうぞ。

続きを読む

Web開発者がスマホアプリ開発をして学んだこと

こんにちは。モビリティサービス開発部の久恒です。
普段はFuelPHPを使ったWebシステムの開発をしていますが、今回初めてReact Nativeを使ったアプリ開発に挑戦する機会をいただきました。

アプリ開発は初めての経験だったので、実際に触ってみての感想や、Web開発経験者として感じたギャップについてお伝えしたいと思います。
続きを読む

社内複業でスマホアプリ開発を経験してみて

オフィスのクーラーに感謝しながら
システム開発を続けているクラウドソリューション開発部の北島です!

「副業」と聞くと、多くの方は会社外での副業を思い浮かべるのではないでしょうか。しかし、当社には「社内複業」という独自の制度があります。これは、本来の業務を続けながら、社内の他部署、他グループのプロジェクトにも参加できる革新的な取り組みです。

今回、私はこの制度を利用してスマホアプリの実装、テスト作成・実施という、普段とは全く異なる業務を経験する機会を得ました。本記事では、社内複業制度について、3ヶ月間の複業生活を通じて感じたこと、学んだことについて、実体験を交えながらご紹介いたします。

続きを読む

3ヶ月でアプリ開発!?リーダーとして駆け抜けた環境広場の舞台裏

はじめに

「3ヶ月で、展示用のアプリをゼロから作って、実際に子どもたちに体験してもらう」
そんなチャレンジが、本当にできるのか。
正直、不安の方が大きかったかもしれません。

でも今、環境広場さっぽろ2025の会場で子どもたちが笑顔でアプリを操作し、「もう一回やりたい!」と言ってくれる姿を思い出すと、あの3ヶ月間の全てが報われたと感じます。

このプロジェクトは、「環境問題を自分ごととして考える」きっかけをつくることを目的に、
生成AI・React Native・iPadを活用したインタラクティブなアプリを開発し、展示したものです。

私はこのチームのリーダーを務めたクラウドソリューション開発部の寺谷です。
社内の9人の仲間とともに、企画から技術実装、ブース設計まで全体を指揮しながら、このプロジェクトを完遂しました。

この記事では、限られた期間の中でどうやってアプリを完成させたのか、
そして、リーダーとして何を考え、どう動いたのかを、お話していきたいと思います。

続きを読む

初心者歓迎!React Nativeアニメーションを「react-native-animatable」で始める第一歩

はじめに

こんにちは。
クラウドソリューション開発部に所属している、入社3年目の寺谷です。

今回は、社外イベントで使用されるタブレットアプリの開発にあたり、視認性が高く、直感的に操作できるUIアニメーションを実現するために、React Nativeのアニメーションライブラリである 「react-native-animatable」 を採用しました。

この記事では、「react-native-animatable」を使って手軽に導入できるアニメーションの実装方法をわかりやすくご紹介します。

React Native初学者の方や、アプリにちょっとした動きを加えて体験を豊かにしたい方に向けた内容となっていますので、ぜひ最後までお付き合いください!

続きを読む

React NativeのGifted Chatを使って簡単なチャットアプリを作ってみた

はじめに

こんにちは。
私は入社2年目のクラウドソリューション開発部に所属している寺谷と申します。
今回は、React Nativeのライブラリ「Gifted Chat」を活用して、簡単なチャットアプリを実装する方法を紹介します。
さらに、Google Sheetsをデータベース代わりに使用し、Google Apps Script(GAS)を通じてデータの送受信も行っています。
ぜひ最後までご覧ください!

続きを読む

React NativeにHTMLコードを混ぜてみた話

react-native-webview

こんにちは!
クラウドソリューション開発部の大川です。

今回は、React NativeでHTMLコードを混ぜて使ってみた話を紹介したいと思います!
「えっ、ネイティブアプリにHTMLを混ぜるってどういうこと?」と思った方、実はこれがとても便利なんですよ・・・!
では早速、その体験談をお届けします!

続きを読む

React Nativeのライブラリを改良する

皆さん、こんにちは。クラウドソリューション開発部に所属している寺谷です。

私たちのグループではスマホアプリの開発を担当しており、React NativeというJavaScriptのフレームワークを使用しています。React Nativeはクロスプラットフォーム(Android,iOS)で動作するため、効率的な開発ができます→iOS.Androidの両方を開発しなくても良いため、単純に工数が少なくなります( ^^)!

スマホアプリ開発のプロジェクトでは、多くの場合、外部のライブラリを利用することが一般的です。しかし、既存のライブラリがそのままではプロジェクトのニーズに合わないこともあります。そのため、ライブラリを修正・カスタマイズすることが必要になる場面、または要求に合ったライブラリを探しにネットの海に旅立つことも少なくありません(*´з`)。

今回は、私がReact Nativeを使った開発で経験したライブラリの修正について、具体的な方法や注意点を紹介します。これからReact Nativeを始める方や、ライブラリのカスタマイズに挑戦したい方にとって役立つ情報をお届けしますので、ぜひ最後までご覧ください!

続きを読む