Packt+ | Advance your knowledge in tech

Explore Products

Best Sellers

New Releases

Books

Videos

Audiobooks

Free Learning

React Native Blueprints

You're reading from React Native Blueprints Create eight exciting native cross-platform mobile applications with JavaScript

Product type Paperback

Published in Nov 2017

Publisher Packt

ISBN-13 9781787288096

Length 346 pages

Edition 1st Edition

Languages

JavaScript

Tools

React

Concepts

Cross Platform Mobile Development

Author (1):

Emilio Rodriguez Martinez

View More author details

Table of Contents (9) Chapters

Preface

1. Shopping List FREE CHAPTER

2. RSS Reader

3. Car Booking App

4. Image Sharing App

5. Guitar Tuner

6. Messaging App

7. Game

8. E-Commerce App

Adding an icon

Once we have our icon designed and saved as a large image, we need to resize it to all the formats Apple requires. In general, these are the sizes required:

20 x 20 px (iPhone Notification 2x)
60 x 60 px (iPhone Notification 3x)
58 x 58 px (iPhone Spotlight - iOS 5,6 2x)
67 x 67 px (iPhone Spotlight - iOS 5,6 3x)
80 x 80 px (iPhone Spotlight - iOS 7-10 2x)
120 x 120 px (iPhone Spotlight - iOS 7-10 3x && iPhone App ios 7-10 2x)
180 x 180 px (iPhone App ios 7-10 3x)

Since this is a very tedious process, we can use one of the online tools which automate all the resizing tasks by providing an image large enough. One of the most popular tools can be found at https://resizeappicon.com/.

Once we have our icon in the proper sizes, we need to add them to our XCode project. We will do this by clicking on Images.xcassets in XCode and adding each image with its corresponding size to each asset in this window:

The next time we compile our app, we will see our new icon in the simulator ...

The rest of the chapter is locked

Register for a free Packt account to unlock a world of extra content!

A free Packt account unlocks extra newsletters, articles, discounted offers, and much more. Start advancing your knowledge today.

Unlock this book and the full library FREE for 7 days

Get unlimited access to 7000+ expert-authored eBooks and videos courses covering every tech area you can think of

Start free trial

Renews at $19.99/month. Cancel anytime

Authors (1)

Martinez

Martinez

Emilio Rodriguez Martinez is a senior software engineer who has been working on highly demanding JavaScript projects since 2010. He transitioned from web development positions into mobile development, first with hybrid technologies such as Cordova and then with native JavaScript solutions such as Titanium. In 2015, he focused on the development and maintenance of several apps built in React Native, some of which were featured in Apple's App Store as the top apps of the week. He is also an active contributor to React Native's codebase and Stack Overflow, where he provides advice on React and React Native questions.

See other products by Martinez

Other recommended products

Related to this chapter

React: Cross-Platform Application Development with React Native

React: Cross-Platform Application Development with React Native

With React Native, you can build native mobile apps that are much more powerful, interactive, and faster by using JavaScript. React Native helps web and mobile developers to build cross-platform apps at a high level. This book takes you through four projects to help understand of the framework and build mobile apps with native user experience.

React Native - Building Mobile Apps with JavaScript

React Native - Building Mobile Apps with JavaScript

The emergence of React Native has made creating mobile apps in JavaScript easier for developers. This book introduces you to the React Native framework and the mobile apps development process. It starts with how React Native fits into the world of hybrid apps, and why it’s a popular framework. You’ll learn how React Native works under the hood--compiling JavaScript to Native code to bridge JavaScript and native apps. Also, you’ll learn how to write React Native components and use the ReactJS way of structuring your app. Understand how to use the industry standard Redux architecture as well as MobX--a newly emerging approach for state management--making your apps more robust and scalable.

Aug 2017 14h 28m

React Native - Building Mobile Apps with JavaScript

React Native - Building Mobile Apps with JavaScript

The emergence of React Native has made creating mobile apps in JavaScript easier for developers. This book introduces you to the React Native framework and the mobile apps development process. It starts with how React Native fits into the world of hybrid apps, and why it’s a popular framework. You’ll learn how React Native works under the hood--compiling JavaScript to Native code to bridge JavaScript and native apps. Also, you’ll learn how to write React Native components and use the ReactJS way of structuring your app. Understand how to use the industry standard Redux architecture as well as MobX--a newly emerging approach for state management--making your apps more robust and scalable.

Aug 2017 14h 28m

React Native - Building Mobile Apps with JavaScript

React Native - Building Mobile Apps with JavaScript

The emergence of React Native has made creating mobile apps in JavaScript easier for developers. This book introduces you to the React Native framework and the mobile apps development process. It starts with how React Native fits into the world of hybrid apps, and why it’s a popular framework. You’ll learn how React Native works under the hood--compiling JavaScript to Native code to bridge JavaScript and native apps. Also, you’ll learn how to write React Native components and use the ReactJS way of structuring your app. Understand how to use the industry standard Redux architecture as well as MobX--a newly emerging approach for state management--making your apps more robust and scalable.

Aug 2017 14h 28m

React Native By Example

React Native By Example

React Native is gaining massive popularity in the world of app development with its ability to build native apps using JavaScript. Developers now have the luxury to create incredible mobile experiences that look and feel native to their platforms using the comfort of a well-known language and the popular React JS library. This book allows you to build your own native mobile applications for the iOS and Android platforms with the benefits of a native mobile experience while leveraging the finesse and simplicity of JavaScript and React.

Apr 2017 13h 48m

React Native By Example

React Native By Example

React Native is gaining massive popularity in the world of app development with its ability to build native apps using JavaScript. Developers now have the luxury to create incredible mobile experiences that look and feel native to their platforms using the comfort of a well-known language and the popular React JS library. This book allows you to build your own native mobile applications for the iOS and Android platforms with the benefits of a native mobile experience while leveraging the finesse and simplicity of JavaScript and React.

Apr 2017 13h 48m

React Native By Example

React Native By Example

React Native is gaining massive popularity in the world of app development with its ability to build native apps using JavaScript. Developers now have the luxury to create incredible mobile experiences that look and feel native to their platforms using the comfort of a well-known language and the popular React JS library. This book allows you to build your own native mobile applications for the iOS and Android platforms with the benefits of a native mobile experience while leveraging the finesse and simplicity of JavaScript and React.

Apr 2017 13h 48m

React Native Cookbook

React Native Cookbook

React Native is perfect for creating mobile applications with maximized code reusability and cost saving. With this practical solutions guide by your side, you can build amazing UIs, tackle mobile development-related issues, and build high-performance apps for mobile environments.

Jan 2019 19h 44m

React Native Cookbook

React Native Cookbook

React Native is perfect for creating mobile applications with maximized code reusability and cost saving. With this practical solutions guide by your side, you can build amazing UIs, tackle mobile development-related issues, and build high-performance apps for mobile environments.

Jan 2019 19h 44m

React Native Cookbook

React Native Cookbook

React Native is perfect for creating mobile applications with maximized code reusability and cost saving. With this practical solutions guide by your side, you can build amazing UIs, tackle mobile development-related issues, and build high-performance apps for mobile environments.

Jan 2019 19h 44m

React Native Cookbook

React Native Cookbook

React Native is perfect for creating mobile applications with maximized code reusability and cost saving. With this practical solutions guide by your side, you can build amazing UIs, tackle mobile development-related issues, and build high-performance apps for mobile environments.

Jan 2019 19h 44m

React Native Cookbook

React Native Cookbook

React Native is perfect for creating mobile applications with maximized code reusability and cost saving. With this practical solutions guide by your side, you can build amazing UIs, tackle mobile development-related issues, and build high-performance apps for mobile environments.

Jan 2019 19h 44m