deha magazine / Webシステム開発
Webシステム開発
はじめてでもわかる!React Nativeの開発環境の整え方
「React Native」はクロスプラットフォームに対応したアプリケーションフレームワークで、iOS、Androidどちらのアプリケーション開発にも利用できます。 「React Native」の経験がない場合、必要な情報をインターネットで調べたり、書籍を探したり、研修の一環で習得するなど、さまざまな方法で準備を進める必要があります。 そこでこの記事ではプログラミングに初めて取り組む方にもわかりやすく、「React Native」での開発環境に必要なものやどんな開発環境が適しているかをご紹介します。 JavaScriptを勉強していた方 アプリ開発を行いたい方 これから「React Native」を利用したい方 これらに当てはまる方におすすめの記事となっています。これを読めばReact Nativeでの構築を始める前にどんな準備が必要なのかが丸わかりですよ。 準備するもの①マシンスペック まず当然ですが開発するパソコンのマシンスペックは高いに越したことはありません。さまざまな処理をするためCPUは最新のものを用意し、メモリは多く積んでおくことをオススメします。 準備するもの②スマートフォン iOSまたはAndroidのスマートフォンの実機を使用してアプリケーションを検証します。 しかし、その都度スマートフォンを取り出し、アプリケーションをインストール・更新するのは手間になるので、エミュレーター上で検証をし、最終段階の検証で実機を使用する方法もあります。 準備するもの③ブラウザ そして開発環境に必要な大切なものがブラウザです。「React Native」の場合は「Google Chrome」が推奨されています。デバッグなどでも使用する場合があります。 準備するもの④開発環境(Windowsの場合) OSは「Windows10 Pro」または「Windows10 Home」を前提とします。インストールの順番は以下の1から6が基本となりますが、個人個人の環境によって前後する場合がありますので注意してください。 Chocolatey パッケージ管理ソフト「Chocolatey」を導入することで、各種ツールをスムーズにインストール・設定することができます。 公式サイト Node.js サーバーサイドのJavaScript実行環境である「Node.js」がビルドで必要となります。頻繁にバージョンアップされるため、その時に必要なバージョンを確認してから導入しましょう。 公式サイト Python 「React Native」のビルドシステムは「Python」が採用されています。 公式サイト 「React Native CLI」 or 「Expo」 「React Native」で開発するためにはアプリケーションツールである「React Native CLI」または「Expo」が必要です。「 Expo」はネイティブな機能を使えないことがあり、「React Native CLI」は「Xcode」の知識が必要です。必要に応じてどちらのアプリケーションツールを使用するかご検討ください。 合わせて読みたい>>Expo✕React Nativeの環境構築を行う【React Native入門】 JDK 「JDK(Java Development Kit)」はJavaの開発ツールがセットになっているパッケージです。 公式サイト […]
続きを読む >>
【移行続出!?】Amazonや楽天とShopify(ショッピファイ)の違いって?Shopify人気の秘密をご紹介
大手ECモールと呼ばれるAmazonや楽天。誰もが知っているサービスですが、近年Shopifyに移行する事業者が増えています。2020年に入って新型コロナウィルスの影響でShopify加入の勢いは増しました。 なぜそのような事が起きているのでしょうか?本日はAmazonと楽天、Shopifyの違いから、その謎を紐解いていきたいと思います。 「Shopifyってなんでそんなに人気が出ているの?」 「Amazonや楽天やShopify。たくさんのECサイト作成サービスがあって、どれを利用すればいいかわからない」 こんな疑問やお悩みが解決できるような内容になっていますよ。
続きを読む >>
【徹底比較】Shopify Plusで何ができる?Shopifyとの違いを調査
Shopify PlusはShopifyのプランの1つです。Shopify Plusを利用すればよりクオリティが高い専門的な機能を利用することができます。 Shopifyに比べ大手企業におすすめのShopifyPlus。本日はそんなShopify PlusとShopifyの通常の機能に関して徹底比較していきます。 「Shopify Plusってどんなサービスなの?」 「Shopifyでどのプランを選択すればいいの?」 これらの疑問が解決できますよ。
続きを読む >>
Flexboxの概要
Flexboxはご存知でしょうか。 Fexboxはサイズが動的なデータの場合でも、コンテナー内のより効率的なレイアウト、配置、およびアイテムとスペースの分配の提供を目的としています。Flexboxは柔軟性があり、フロートやpositionを使用せずにレスポンシブレイアウトを簡単に設計できます。 水平方向の位置のあるテキスト、コンテンツのブロックと別のブロックを中央に整列させる必要がある 中央に整列のためCSSトリックを利用するが、全画面または動的データが表示されない状態になる サードパーティのライブラリを利用せずに、レスポンシブインターフェースの設計が大変 など、FexboxならPhotoshopから画像を書き出す際に起こりがちな問題を解決することができますよ。 IT人材が不足している事業者様 floatを使用したレイアウトを行っていた方 Flexbox について詳しく知りたい方 これらに当てはまる方におすすめの記事となっています。これを読めばFlexboxの使い方や概要を知ることができます。
続きを読む >>
【簡単】アフィリエイトの仕組みって?Shopify (ショッピファイ)で使える!フルフィルメントに関しても解説
人気のECサイト作成サービスShopifyでは、アフィリエイトを利用した商品販売が行えたり、フルフィルメントで外部に委託をすることもできます。 これらの機能は、事業者の運営負担を軽減することにつながり、より柔軟な販売が実現します。 この記事ではそのアフィリエイトとフルフィルメントに着目して、それらのメリットやデメリットを徹底解説していきます。 「Shopifyにおけるアフィリエイトの仕組みってどんなもの?」 「もっと楽にShopifyを運営したいけど、方法はある?」 「集客などのマーケティングにもっと時間を割きたい」 これらの疑問が解決できる内容となっていますよ。
続きを読む >>
【徹底比較】React Native対 Flutter【アプリ開発に必要な5つのポイント】
スマートフォンが普及し、さまざまな技術が進化する中で、クロスプラットフォーム開発は開発期間の短縮やコスト削減などのメリットが多くあるため、開発会社・エンジニアにとってなくてはならない存在となっています。 そんなクロスプラットフォームの中で、特に多く利用されているのが「React Native(リアクト・ネイティブ)」と「Flutter(フラッター)」です。 「React Native」はJavascriptを取得して入ればアプリの開発が可能。一方、「Flutter」はDartで開発を行います。 どちらも共通しているのはiOSアプリとAndroidアプリに同じコードベースを使用できるクロスプラットフォームであるということです。ただし、それぞれ独自の特徴があり、メリット・デメリットがあります。 そこで今回は「React Native」と「Flutter」を5つのポイントに絞って比較します。 モバイルアプリの開発・運用のコストパフォーマンスを高めたい方 「React Native」や「Flutter」が気になっている方 「React Native」や「Flutter」の違いを知りたい方 これらに当てはまる方におすすめの記事となっています。これを読めば「React Native」や「Flutter」のどちらを使って開発を行うべきかがわかりますよ。
続きを読む >>
Laravel+PHPUnitで認証付きAPIのテストを行う
PHPの人気のフレームワークLaravelではWebサイトの管理画面を開発することができます。 開発の手順に関しては以下の記事にて具体的に紹介をしていきました。 Laravel(API)とNuxt.jsの連携を行う【Laravel6+Nuxt.jsで作る管理画面】 CookieによるAPI経由のユーザー認証機能を作る【Laravel6とNuxt.jsで作る管理画面】 Nuxt.js+VuetifyとLaravelでCRUDを作る さらに開発後のデプロイの手順は以下で解説していきました。 Heroku+Laravel+MySQLを独自ドメインで公開する Nuxt.jsをSSRモードでHerokuにデプロイして公開する この記事ではPHPUnitでLaravelのAPIテストをする方法について解説しています。 Laravelを使って構築をしたい方 Webサイト構築の具体的な手法が知りたい方 におすすめの記事となっています。これを読めばいよいよLaravelで開発した管理画面をリリースする準備ができますよ。
続きを読む >>
【保存版】Shopify(ショッピファイ)でできる!ドロップシッピングとは?【化粧品販売に有効】
人気のECプラットフォームShopifyでは、ドロップシッピングと呼ばれる在庫の無在庫販売が行えます。 このドロップシッピングでは、配送や在庫管理と言った業務を委託することができ、自社の商品を用意する必要もありません。つまり誰でも簡単にオンラインストア運営ができるのです。 実際ドロップシッピングは近年注目を浴びていて、特に化粧品販売などで人気を博しています。 この記事ではそんなドロップシッピングについて解説しています。 ECサイト運営初心者さんはもちろん、忙しいスタートアップ企業の経営者さんもぜひ注目ですよ。
続きを読む >>
【感動】React Nativeならアプリ開発が効率化!?【クロスプラットフォーム対応】
スマートフォンやタブレットの普及が進み、私達の生活やビジネスにはなくてはならない存在となりました。 アプリを開発する側にとって、プラットフォームをどうするか、というのはとても重要なポイントです。 iOSとAndroidの2種類をそれぞれ開発するか、Webアプリで開発するか、あるいはハイブリッドアプリを開発するか、などの選択肢があります。 合わせて読みたい>>「Webアプリ」と「ネイティブアプリ」のメリット・デメリット この記事ではアプリ開発をスムーズにできる「React Native」をご紹介します。「React Native」ならクロスプラットフォーム対応であり、JavaScriptでの開発ができるだけでなく、修正対応もスムーズに行えます。 React Nativeについて詳しく知りたい方 アプリ開発を行いたい方 JavaScriptのスキルがある方 これらに当てはまる方におすすめの記事となっています。これを読めばアプリ開発の手助けになる「React Native」について丸わかりですよ。
続きを読む >>
Nuxt.jsをSSRモードでHerokuにデプロイして公開する
PHPの人気のフレームワークLaravelではWebサイトの管理画面を開発することができます。 開発の手順に関しては以下の記事にて具体的に紹介をしていきました。 Laravel(API)とNuxt.jsの連携を行う【Laravel6+Nuxt.jsで作る管理画面】 CookieによるAPI経由のユーザー認証機能を作る【Laravel6とNuxt.jsで作る管理画面】 Nuxt.js+VuetifyとLaravelでCRUDを作る また、Heroku+Laravel+MySQLを独自ドメイン(SSL)で公開する【Laravel6+Nuxt.jsで作る管理画面】の記事で、HerokuにLaravelを独自ドメイン(SSL)でデプロイする手順を解説していきました。 この記事ではNuxt.jsをデプロイして、管理画面を公開して使うことが出来るようにする方法をご紹介! Laravelを使って構築をしたい方 Webサイト構築の具体的な手法が知りたい方 これらに当てはまる方におすすめの記事となっています。このシリーズを読めばLaravel6とNuxt.jsで管理画面を作成することができますよ。