diff --git a/with-icons/App.js b/with-icons/App.js
new file mode 100644
index 0000000..c78a777
--- /dev/null
+++ b/with-icons/App.js
@@ -0,0 +1,25 @@
+import { FontAwesome, MaterialIcons } from '@expo/vector-icons';
+import React from 'react';
+import { StyleSheet, View } from 'react-native';
+
+export default function App() {
+ return (
+
+
+
+ {/* Create a button */}
+ {}}>
+ Login with Facebook
+
+
+ );
+}
+
+const styles = StyleSheet.create({
+ container: {
+ flex: 1,
+ backgroundColor: '#fff',
+ alignItems: 'center',
+ justifyContent: 'center',
+ },
+});
diff --git a/with-icons/README.md b/with-icons/README.md
new file mode 100644
index 0000000..e321061
--- /dev/null
+++ b/with-icons/README.md
@@ -0,0 +1,43 @@
+# [Icons Example](https://docs.expo.io/versions/latest/guides/icons/)
+
+
+
+
+
+
+
+
+
+
+The package `@expo/vector-icons` enables you to use most popular icon sets in a universal app. For more information please refer to the docs: [Expo Icons](https://docs.expo.io/versions/latest/guides/icons/).
+
+## 🚀 How to use
+
+#### Creating a new project**
+
+- Install the CLI: `npm i -g expo-cli`
+- Create a project: `expo init `
+- `cd` into the project
+
+### Using Icons
+
+- Install the package:
+ ```sh
+ expo install @expo/vector-icons
+ ```
+- Import the fonts you want to use
+```js
+import {
+ FontAwesome,
+ AntDesign,
+ Entypo,
+ EvilIcons,
+ Feather,
+ FontAwesome
+} from '@expo/vector-icons';
+```
+
+## 📝 Notes
+
+- [Icon directory](https://expo.github.io/vector-icons/)
+- [`@expo/vector-icons` documentation](https://docs.expo.io/versions/latest/guides/icons/)
diff --git a/with-icons/app.json b/with-icons/app.json
new file mode 100644
index 0000000..a1ff3eb
--- /dev/null
+++ b/with-icons/app.json
@@ -0,0 +1,12 @@
+{
+ "expo": {
+ "name": "with-icons",
+ "version": "1.0.0",
+ "icon": "https://github.com/expo/expo/blob/master/templates/expo-template-blank/assets/icon.png?raw=true",
+ "splash": {
+ "image": "https://github.com/expo/expo/blob/master/templates/expo-template-blank/assets/splash.png?raw=true",
+ "resizeMode": "contain",
+ "backgroundColor": "#ffffff"
+ }
+ }
+}
diff --git a/with-icons/babel.config.js b/with-icons/babel.config.js
new file mode 100644
index 0000000..2900afe
--- /dev/null
+++ b/with-icons/babel.config.js
@@ -0,0 +1,6 @@
+module.exports = function(api) {
+ api.cache(true);
+ return {
+ presets: ['babel-preset-expo'],
+ };
+};
diff --git a/with-icons/package.json b/with-icons/package.json
new file mode 100644
index 0000000..6d6114d
--- /dev/null
+++ b/with-icons/package.json
@@ -0,0 +1,14 @@
+{
+ "dependencies": {
+ "@expo/vector-icons": "10.0.0",
+ "expo": "36.0.0",
+ "react": "16.9.0",
+ "react-dom": "16.9.0",
+ "react-native": "https://github.com/expo/react-native/archive/sdk-36.0.0.tar.gz",
+ "react-native-web": "0.11.7"
+ },
+ "devDependencies": {
+ "@babel/core": "7.0.0",
+ "babel-preset-expo": "8.0.0"
+ }
+}