React-Native file structure

001

·

3 min read

React-Native file structure

Generally, React-Native is one of the most popular frameworks to build mobile applications and the most interesting part of it is it only needs javaScript to build an application yes you are right not only for Android but also for ios developers Cheers!!

Here I am going to write the file structure of a react-native application.
we don't create all the required files on our own we use /react-native init command basically to create the basic template and then we start to build our application. don't get scared by seeing that file structure folks.

here I will describe which files or folders we need to look around and start building -

  • _tests_: here we write the tests basically that we want to initiate in our application suppose we want to check if the buttons are rendered properly or if the app itself is that rendering properly like these. We don't need to check it in the beginner level though.

  • android & ios: in react native we write code in app.jsx or app.tsx file and in javascript but we build the application to run on Android or ios devices and it will not be a web app it will be actually an application that you install and enjoy.
    so after writing a lot of code we make builds and those builds are the converter in one type and all the required files needed to generate the build of your application is resides in these two specific folder for Android and ios respectively.

  • .node_modules: suppose we want to add any functionality in our react-native application so we install that library or module or whatever it is and from that time our application will get dependent on that library or module but it is very much possible and true that that module is also dependant with some other modules to provide us that functionality in our application so that module is also dependant in some other so when we install all the required files and folders you will find in the node modules folder

  • .gitignore: explaining this as simply as possible suppose you want to push your code in GitHub in that scenario we don't want to push everything over there like node_modules or any file which you don't want to you just go and type that file or folder name in .gitignore file it won't be pushed into GitHub. that's it.

  • app.tsx: this is the file that holds all our applications within it. so whatever you do do it here and it will get reflected.

  • App.json: This file contains configuration data for your app, such as the app name, version, and description.

  • index.js: this will be the entry point of your react-native application. when you start your application this file will execute first and the whole app resides inside this file. This file renders the root component of your app.

  • package.json: this file contains all the metadata of our application go here first and you will get an idea about the application or what the things used to build that particular application

that's all I think the main file that you required to know at the beginner level of your react-native maybe I gave you an idea.

so go ahead and start building. Thank you..