Simple example - Galio framework with React Native

React Native and Galio Framework


Reference : https://galio.io/


Galio is free and open source react native UI library.


In this article, I will show you how to use the Galio framework with React Native.


react-native-galio-1.PNG

galio starter kit


https://github.com/galio-org/galio-starter-kit#quick-start


- Create a new folder and navigate to the directory you created using the command prompt.


- Execute the following command using the command prompt.


> git clone https://github.com/galio-org/galio-starter-kit.git

After the above command is executed, you will be looked like the following screenshot on your browser.


react-native-galio-2.PNG

> cd galio-starter-kit
> yarn install

react-native-galio-3.PNG

I will run the application on Android via USB.


react-native-galio-8.PNG

Before running the application, we will install the Expo Go application from the Google Play Store for Android.


You can view our new application on Expo Go.


> expo start –-android

After running the above command I got the following error.


react-native-galio-4.PNG

You can refer to the link below to resolve this error.


https://stackoverflow.com/questions/58120990/how-to-resolve-the-error-on-react-native-start


The "code ." is used to open the project in Visual Studio Code.


react-native-galio-5.PNG

- I replaced the sharedBlacklist variable with the following value in the ...\galio-starter-kit\node_modules\metro-config\src\defaults\blacklist.js


( Don't forget to save the blacklist.js file with CTRL+S )


react-native-galio-6.PNG

var sharedBlacklist = [
  /node_modules[\/\\]react[\/\\]dist[\/\\].*/,
  /website\/node_modules\/.*/,
  /heapCapture\/bundle\.js/,
  /.*\/__tests__\/.*/
];

- Execute the following command again


> expo start –-android

react-native-galio-7.PNG

- Press the “Run on Android device/emulator” button as shown in the screenshot above.


(Don’t forget to be connected to the internet)


I got the “The project uses SDK v35.0.0, but this version of Expo Go requires at least v37.0.0.” error as shown below.


react-native-galio-1.jpeg

> react-native start --reset-cache
> yarn install
> expo start –android

react-native-galio-2.jpeg

react-native-galio-3.jpeg

react-native-galio-4.jpeg

react-native-galio-5.jpeg