diff --git a/404.html b/404.html index e7fb4bd..2e00ba9 100644 --- a/404.html +++ b/404.html @@ -5,13 +5,13 @@ Page Not Found | React Native Template - +
Skip to main content

Page Not Found

We could not find what you were looking for.

Please contact the owner of the site that linked you to the original URL and let them know their link is broken.

- + \ No newline at end of file diff --git a/assets/js/d589d3a7.ced7c932.js b/assets/js/d589d3a7.2fc0b8ff.js similarity index 99% rename from assets/js/d589d3a7.ced7c932.js rename to assets/js/d589d3a7.2fc0b8ff.js index c08bbe5..a12d975 100644 --- a/assets/js/d589d3a7.ced7c932.js +++ b/assets/js/d589d3a7.2fc0b8ff.js @@ -1 +1 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[162],{601:(e,t,a)=>{a.r(t),a.d(t,{contentTitle:()=>l,default:()=>u,frontMatter:()=>r,metadata:()=>o,toc:()=>s});var n=a(7462),i=(a(7294),a(3905));const r={title:"Getting Started",sidebar_position:1},l=void 0,o={unversionedId:"getting-started",id:"getting-started",isDocsHomePage:!1,title:"Getting Started",description:"Prerequisite",source:"@site/docs/getting-started.md",sourceDirName:".",slug:"/getting-started",permalink:"/react-native-template/docs/getting-started",editUrl:"https://github.com/ajaykumar97/react-native-template/edit/master/website/docs/getting-started.md",version:"current",sidebarPosition:1,frontMatter:{title:"Getting Started",sidebar_position:1},sidebar:"tutorialSidebar",next:{title:"Key Features",permalink:"/react-native-template/docs/key-features"}},s=[{value:"Prerequisite",id:"prerequisite",children:[]},{value:"Initialising",id:"initialising",children:[]},{value:"Install from GitHub",id:"install-from-github",children:[]},{value:"Notes",id:"notes",children:[]},{value:"Use Older versions",id:"use-older-versions",children:[]},{value:"Configure Google Service Files",id:"configure-google-service-files",children:[]},{value:"Make your own template",id:"make-your-own-template",children:[]},{value:"Need further help?",id:"need-further-help",children:[]},{value:"Roadmap",id:"roadmap",children:[]}],p={toc:s};function u(e){let{components:t,...a}=e;return(0,i.kt)("wrapper",(0,n.Z)({},p,a,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h2",{id:"prerequisite"},"Prerequisite"),(0,i.kt)("ol",null,(0,i.kt)("li",{parentName:"ol"},(0,i.kt)("p",{parentName:"li"},"Make sure that you have followed the environment setup instructions properly from the official ",(0,i.kt)("a",{parentName:"p",href:"https://reactnative.dev/docs/environment-setup"},"React Native docs"),".")),(0,i.kt)("li",{parentName:"ol"},(0,i.kt)("p",{parentName:"li"},"Make sure that your Cocoapods version is >= 3.5.7. If its lower than 3.5.7, you can update it using the following command:"))),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell"},"sudo gem install cocoapods\n")),(0,i.kt)("ol",{start:3},(0,i.kt)("li",{parentName:"ol"},"The installation command will fail if you have the global legacy ",(0,i.kt)("inlineCode",{parentName:"li"},"react-native-cli")," installed in your machine. Make sure you uninstall it first:")),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell"},"yarn global remove react-native-cli\n")),(0,i.kt)("p",null,"or if using ",(0,i.kt)("inlineCode",{parentName:"p"},"npm")),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell"},"npm uninstall -g react-native-cli\n")),(0,i.kt)("h2",{id:"initialising"},"Initialising"),(0,i.kt)("p",null,"Generate a new React Native(",(0,i.kt)("strong",{parentName:"p"},"v0.74"),") app using the ",(0,i.kt)("strong",{parentName:"p"},"@ajaysidhu/react-native-template"),":"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell"},"npx react-native init myapp --template @ajaysidhu/react-native-template --skip-install --pm npm --skip-git-init\n")),(0,i.kt)("p",null,"You might also be prompted to confirm the installation for the packages ",(0,i.kt)("inlineCode",{parentName:"p"},"react-native")," and ",(0,i.kt)("inlineCode",{parentName:"p"},"husky"),". Simply hit ",(0,i.kt)("inlineCode",{parentName:"p"},"enter")," to proceed."),(0,i.kt)("p",null,"The template will automatically install the ",(0,i.kt)("inlineCode",{parentName:"p"},"npm")," dependencies and the ",(0,i.kt)("inlineCode",{parentName:"p"},"pods")," (if you are on the MacOS)."),(0,i.kt)("h2",{id:"install-from-github"},"Install from GitHub"),(0,i.kt)("p",null,"If you want to use the template directly from the ",(0,i.kt)("inlineCode",{parentName:"p"},"GitHub")," or try out the latest features which are not release to the ",(0,i.kt)("inlineCode",{parentName:"p"},"npm")," yet, then you can run:"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell"},"npx react-native init myapp --template https://github.com/ajaykumar97/react-native-template.git --skip-install --pm npm --skip-git-init\n")),(0,i.kt)("h2",{id:"notes"},"Notes"),(0,i.kt)("ol",null,(0,i.kt)("li",{parentName:"ol"},"Starting React Native ",(0,i.kt)("strong",{parentName:"li"},"v0.74"),", Xcode does not start Metro bundler automatically. If you are running the app from the XCode, please make sure that your metro bundler is running before running the build from XCode. You can start the metro bundler by running the following command in the root directory of your newly created project using this template:")),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell"},"npm start\n")),(0,i.kt)("ol",{start:2},(0,i.kt)("li",{parentName:"ol"},"Minimum supported versions:")),(0,i.kt)("ul",null,(0,i.kt)("li",{parentName:"ul"},"iOS: 15"),(0,i.kt)("li",{parentName:"ul"},"Android: 26")),(0,i.kt)("h2",{id:"use-older-versions"},"Use Older versions"),(0,i.kt)("p",null,"If you want to use an older version of the template, then you can run(replace ",(0,i.kt)("inlineCode",{parentName:"p"},"version")," with your desired version):"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell"},"npx react-native init myapp --template @ajaysidhu/react-native-template@version --skip-install --pm npm --skip-git-init\n")),(0,i.kt)("p",null,"You can look at all versions, that I have published ",(0,i.kt)("a",{parentName:"p",href:"https://github.com/ajaykumar97/react-native-template/releases"},"here"),"."),(0,i.kt)("h2",{id:"configure-google-service-files"},"Configure Google Service Files"),(0,i.kt)("p",null,"If you want to extend the setup further to configure different Google Service files for ",(0,i.kt)("strong",{parentName:"p"},"Development"),", ",(0,i.kt)("strong",{parentName:"p"},"Testing"),", ",(0,i.kt)("strong",{parentName:"p"},"Staging")," and ",(0,i.kt)("strong",{parentName:"p"},"Production")," environments, you can follow my ",(0,i.kt)("a",{parentName:"p",href:"https://medium.com/swlh/part-3-configure-bundle-ids-app-name-and-google-service-files-94aed34bbca5"},"this")," Medium post."),(0,i.kt)("h2",{id:"make-your-own-template"},"Make your own template"),(0,i.kt)("p",null,"Enjoying this awesome template feature of ",(0,i.kt)("inlineCode",{parentName:"p"},"react-native-cli")," and want to build your own react-native-template? No worries! I have written a dedicated post to create your own ",(0,i.kt)("inlineCode",{parentName:"p"},"react-native-template")," based your own project needs. You can give it a read ",(0,i.kt)("a",{parentName:"p",href:"https://hackernoon.com/how-to-quickly-create-a-custom-template-in-react-native-4up340g"},"here"),"."),(0,i.kt)("h2",{id:"need-further-help"},"Need further help?"),(0,i.kt)("p",null,"Thank you for choosing our React Native Template for your mobile app development needs. We're thrilled to contribute to your project's success!"),(0,i.kt)("p",null,"Should you encounter any issues, have questions, or need further assistance using our package to initialise your new mobile app, please don't hesitate to reach out. Our team at Diligentic Infotech is here to help you every step of the way."),(0,i.kt)("p",null,"Feel free to visit our website ",(0,i.kt)("a",{parentName:"p",href:"https://diligentic.com/get-in-touch"},"Diligentic Infotech")," to learn more about our services and how we can support your mobile app development journey."),(0,i.kt)("p",null,"Happy coding, and we look forward to hearing from you!"),(0,i.kt)("h2",{id:"roadmap"},"Roadmap"),(0,i.kt)("ul",{className:"contains-task-list"},(0,i.kt)("li",{parentName:"ul",className:"task-list-item"},(0,i.kt)("input",{parentName:"li",type:"checkbox",checked:!0,disabled:!0})," ","Add ",(0,i.kt)("a",{parentName:"li",href:"https://github.com/oblador/react-native-keychain"},"react-native-keychain")," for secured user data storage"),(0,i.kt)("li",{parentName:"ul",className:"task-list-item"},(0,i.kt)("input",{parentName:"li",type:"checkbox",checked:!1,disabled:!0})," ","Add dark mode"),(0,i.kt)("li",{parentName:"ul",className:"task-list-item"},(0,i.kt)("input",{parentName:"li",type:"checkbox",checked:!1,disabled:!0})," ","Add docs to explain provided common components usages"),(0,i.kt)("li",{parentName:"ul",className:"task-list-item"},(0,i.kt)("input",{parentName:"li",type:"checkbox",checked:!1,disabled:!0})," ","Add atomic structure for components"),(0,i.kt)("li",{parentName:"ul",className:"task-list-item"},(0,i.kt)("input",{parentName:"li",type:"checkbox",checked:!1,disabled:!0})," ","Add common styles"),(0,i.kt)("li",{parentName:"ul",className:"task-list-item"},(0,i.kt)("input",{parentName:"li",type:"checkbox",checked:!1,disabled:!0})," ","Add website docs versioning"),(0,i.kt)("li",{parentName:"ul",className:"task-list-item"},(0,i.kt)("input",{parentName:"li",type:"checkbox",checked:!1,disabled:!0})," ","Add RTL languages support")))}u.isMDXComponent=!0}}]); \ No newline at end of file +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[162],{601:(e,t,a)=>{a.r(t),a.d(t,{contentTitle:()=>l,default:()=>u,frontMatter:()=>r,metadata:()=>o,toc:()=>s});var n=a(7462),i=(a(7294),a(3905));const r={title:"Getting Started",sidebar_position:1},l=void 0,o={unversionedId:"getting-started",id:"getting-started",isDocsHomePage:!1,title:"Getting Started",description:"Prerequisite",source:"@site/docs/getting-started.md",sourceDirName:".",slug:"/getting-started",permalink:"/react-native-template/docs/getting-started",editUrl:"https://github.com/ajaykumar97/react-native-template/edit/master/website/docs/getting-started.md",version:"current",sidebarPosition:1,frontMatter:{title:"Getting Started",sidebar_position:1},sidebar:"tutorialSidebar",next:{title:"Key Features",permalink:"/react-native-template/docs/key-features"}},s=[{value:"Prerequisite",id:"prerequisite",children:[]},{value:"Initialising",id:"initialising",children:[]},{value:"Install from GitHub",id:"install-from-github",children:[]},{value:"Notes",id:"notes",children:[]},{value:"Use Older versions",id:"use-older-versions",children:[]},{value:"Configure Google Service Files",id:"configure-google-service-files",children:[]},{value:"Make your own template",id:"make-your-own-template",children:[]},{value:"Need further help?",id:"need-further-help",children:[]},{value:"Roadmap",id:"roadmap",children:[]}],p={toc:s};function u(e){let{components:t,...a}=e;return(0,i.kt)("wrapper",(0,n.Z)({},p,a,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h2",{id:"prerequisite"},"Prerequisite"),(0,i.kt)("ol",null,(0,i.kt)("li",{parentName:"ol"},(0,i.kt)("p",{parentName:"li"},"Make sure that you have followed the environment setup instructions properly from the official ",(0,i.kt)("a",{parentName:"p",href:"https://reactnative.dev/docs/environment-setup"},"React Native docs"),".")),(0,i.kt)("li",{parentName:"ol"},(0,i.kt)("p",{parentName:"li"},"Make sure that your Cocoapods version is >= 3.5.7. If its lower than 3.5.7, you can update it using the following command:"))),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell"},"sudo gem install cocoapods\n")),(0,i.kt)("ol",{start:3},(0,i.kt)("li",{parentName:"ol"},"The installation command will fail if you have the global legacy ",(0,i.kt)("inlineCode",{parentName:"li"},"react-native-cli")," installed in your machine. Make sure you uninstall it first:")),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell"},"yarn global remove react-native-cli\n")),(0,i.kt)("p",null,"or if using ",(0,i.kt)("inlineCode",{parentName:"p"},"npm")),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell"},"npm uninstall -g react-native-cli\n")),(0,i.kt)("h2",{id:"initialising"},"Initialising"),(0,i.kt)("p",null,"Generate a new React Native(",(0,i.kt)("strong",{parentName:"p"},"v0.75"),") app using the ",(0,i.kt)("strong",{parentName:"p"},"@ajaysidhu/react-native-template"),":"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell"},"npx react-native init myapp --template @ajaysidhu/react-native-template --skip-install --pm npm --skip-git-init\n")),(0,i.kt)("p",null,"You might also be prompted to confirm the installation for the packages ",(0,i.kt)("inlineCode",{parentName:"p"},"react-native")," and ",(0,i.kt)("inlineCode",{parentName:"p"},"husky"),". Simply hit ",(0,i.kt)("inlineCode",{parentName:"p"},"enter")," to proceed."),(0,i.kt)("p",null,"The template will automatically install the ",(0,i.kt)("inlineCode",{parentName:"p"},"npm")," dependencies and the ",(0,i.kt)("inlineCode",{parentName:"p"},"pods")," (if you are on the MacOS)."),(0,i.kt)("h2",{id:"install-from-github"},"Install from GitHub"),(0,i.kt)("p",null,"If you want to use the template directly from the ",(0,i.kt)("inlineCode",{parentName:"p"},"GitHub")," or try out the latest features which are not release to the ",(0,i.kt)("inlineCode",{parentName:"p"},"npm")," yet, then you can run:"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell"},"npx react-native init myapp --template https://github.com/ajaykumar97/react-native-template.git --skip-install --pm npm --skip-git-init\n")),(0,i.kt)("h2",{id:"notes"},"Notes"),(0,i.kt)("ol",null,(0,i.kt)("li",{parentName:"ol"},"Starting React Native ",(0,i.kt)("strong",{parentName:"li"},"v0.74"),", Xcode does not start Metro bundler automatically. If you are running the app from the XCode, please make sure that your metro bundler is running before running the build from XCode. You can start the metro bundler by running the following command in the root directory of your newly created project using this template:")),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell"},"npm start\n")),(0,i.kt)("ol",{start:2},(0,i.kt)("li",{parentName:"ol"},"Minimum supported versions:")),(0,i.kt)("ul",null,(0,i.kt)("li",{parentName:"ul"},"iOS: 15"),(0,i.kt)("li",{parentName:"ul"},"Android: 26")),(0,i.kt)("h2",{id:"use-older-versions"},"Use Older versions"),(0,i.kt)("p",null,"If you want to use an older version of the template, then you can run(replace ",(0,i.kt)("inlineCode",{parentName:"p"},"version")," with your desired version):"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell"},"npx react-native init myapp --template @ajaysidhu/react-native-template@version --skip-install --pm npm --skip-git-init\n")),(0,i.kt)("p",null,"You can look at all versions, that I have published ",(0,i.kt)("a",{parentName:"p",href:"https://github.com/ajaykumar97/react-native-template/releases"},"here"),"."),(0,i.kt)("h2",{id:"configure-google-service-files"},"Configure Google Service Files"),(0,i.kt)("p",null,"If you want to extend the setup further to configure different Google Service files for ",(0,i.kt)("strong",{parentName:"p"},"Development"),", ",(0,i.kt)("strong",{parentName:"p"},"Testing"),", ",(0,i.kt)("strong",{parentName:"p"},"Staging")," and ",(0,i.kt)("strong",{parentName:"p"},"Production")," environments, you can follow my ",(0,i.kt)("a",{parentName:"p",href:"https://medium.com/swlh/part-3-configure-bundle-ids-app-name-and-google-service-files-94aed34bbca5"},"this")," Medium post."),(0,i.kt)("h2",{id:"make-your-own-template"},"Make your own template"),(0,i.kt)("p",null,"Enjoying this awesome template feature of ",(0,i.kt)("inlineCode",{parentName:"p"},"react-native-cli")," and want to build your own react-native-template? No worries! I have written a dedicated post to create your own ",(0,i.kt)("inlineCode",{parentName:"p"},"react-native-template")," based your own project needs. You can give it a read ",(0,i.kt)("a",{parentName:"p",href:"https://hackernoon.com/how-to-quickly-create-a-custom-template-in-react-native-4up340g"},"here"),"."),(0,i.kt)("h2",{id:"need-further-help"},"Need further help?"),(0,i.kt)("p",null,"Thank you for choosing our React Native Template for your mobile app development needs. We're thrilled to contribute to your project's success!"),(0,i.kt)("p",null,"Should you encounter any issues, have questions, or need further assistance using our package to initialise your new mobile app, please don't hesitate to reach out. Our team at Diligentic Infotech is here to help you every step of the way."),(0,i.kt)("p",null,"Feel free to visit our website ",(0,i.kt)("a",{parentName:"p",href:"https://diligentic.com/get-in-touch"},"Diligentic Infotech")," to learn more about our services and how we can support your mobile app development journey."),(0,i.kt)("p",null,"Happy coding, and we look forward to hearing from you!"),(0,i.kt)("h2",{id:"roadmap"},"Roadmap"),(0,i.kt)("ul",{className:"contains-task-list"},(0,i.kt)("li",{parentName:"ul",className:"task-list-item"},(0,i.kt)("input",{parentName:"li",type:"checkbox",checked:!0,disabled:!0})," ","Add ",(0,i.kt)("a",{parentName:"li",href:"https://github.com/oblador/react-native-keychain"},"react-native-keychain")," for secured user data storage"),(0,i.kt)("li",{parentName:"ul",className:"task-list-item"},(0,i.kt)("input",{parentName:"li",type:"checkbox",checked:!1,disabled:!0})," ","Add dark mode"),(0,i.kt)("li",{parentName:"ul",className:"task-list-item"},(0,i.kt)("input",{parentName:"li",type:"checkbox",checked:!1,disabled:!0})," ","Add docs to explain provided common components usages"),(0,i.kt)("li",{parentName:"ul",className:"task-list-item"},(0,i.kt)("input",{parentName:"li",type:"checkbox",checked:!1,disabled:!0})," ","Add atomic structure for components"),(0,i.kt)("li",{parentName:"ul",className:"task-list-item"},(0,i.kt)("input",{parentName:"li",type:"checkbox",checked:!1,disabled:!0})," ","Add common styles"),(0,i.kt)("li",{parentName:"ul",className:"task-list-item"},(0,i.kt)("input",{parentName:"li",type:"checkbox",checked:!1,disabled:!0})," ","Add website docs versioning"),(0,i.kt)("li",{parentName:"ul",className:"task-list-item"},(0,i.kt)("input",{parentName:"li",type:"checkbox",checked:!1,disabled:!0})," ","Add RTL languages support")))}u.isMDXComponent=!0}}]); \ No newline at end of file diff --git a/assets/js/runtime~main.ea62f72c.js b/assets/js/runtime~main.ea62f72c.js new file mode 100644 index 0000000..eac5465 --- /dev/null +++ b/assets/js/runtime~main.ea62f72c.js @@ -0,0 +1 @@ +(()=>{"use strict";var e,t,r,o,n,a={},c={};function f(e){var t=c[e];if(void 0!==t)return t.exports;var r=c[e]={id:e,loaded:!1,exports:{}};return a[e].call(r.exports,r,r.exports,f),r.loaded=!0,r.exports}f.m=a,f.c=c,e=[],f.O=(t,r,o,n)=>{if(!r){var a=1/0;for(s=0;s=n)&&Object.keys(f.O).every((e=>f.O[e](r[i])))?r.splice(i--,1):(c=!1,n0&&e[s-1][2]>n;s--)e[s]=e[s-1];e[s]=[r,o,n]},f.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return f.d(t,{a:t}),t},r=Object.getPrototypeOf?e=>Object.getPrototypeOf(e):e=>e.__proto__,f.t=function(e,o){if(1&o&&(e=this(e)),8&o)return e;if("object"==typeof e&&e){if(4&o&&e.__esModule)return e;if(16&o&&"function"==typeof e.then)return e}var n=Object.create(null);f.r(n);var a={};t=t||[null,r({}),r([]),r(r)];for(var c=2&o&&e;"object"==typeof c&&!~t.indexOf(c);c=r(c))Object.getOwnPropertyNames(c).forEach((t=>a[t]=()=>e[t]));return a.default=()=>e,f.d(n,a),n},f.d=(e,t)=>{for(var r in t)f.o(t,r)&&!f.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},f.f={},f.e=e=>Promise.all(Object.keys(f.f).reduce(((t,r)=>(f.f[r](e,t),t)),[])),f.u=e=>"assets/js/"+({53:"935f2afb",85:"1f391b9e",162:"d589d3a7",173:"d167c9fe",195:"c4f5d8e4",414:"393be207",514:"1be78505",516:"a5f93cd8",592:"common",599:"e833177e",918:"17896441"}[e]||e)+"."+{53:"d1edc687",85:"55e6ef7a",162:"2fc0b8ff",173:"a41f6225",195:"e8097e42",414:"90c32b60",514:"d591cc98",516:"911fcd82",592:"ce3b74b1",599:"64c2ed9a",608:"7a1dfb64",918:"62b9449c",933:"74580eb2"}[e]+".js",f.miniCssF=e=>"assets/css/styles.670ddddb.css",f.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),f.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),o={},n="docs:",f.l=(e,t,r,a)=>{if(o[e])o[e].push(t);else{var c,i;if(void 0!==r)for(var d=document.getElementsByTagName("script"),s=0;s{c.onerror=c.onload=null,clearTimeout(p);var n=o[e];if(delete o[e],c.parentNode&&c.parentNode.removeChild(c),n&&n.forEach((e=>e(r))),t)return t(r)},p=setTimeout(u.bind(null,void 0,{type:"timeout",target:c}),12e4);c.onerror=u.bind(null,c.onerror),c.onload=u.bind(null,c.onload),i&&document.head.appendChild(c)}},f.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},f.p="/react-native-template/",f.gca=function(e){return e={17896441:"918","935f2afb":"53","1f391b9e":"85",d589d3a7:"162",d167c9fe:"173",c4f5d8e4:"195","393be207":"414","1be78505":"514",a5f93cd8:"516",common:"592",e833177e:"599"}[e]||e,f.p+f.u(e)},(()=>{var e={303:0,532:0};f.f.j=(t,r)=>{var o=f.o(e,t)?e[t]:void 0;if(0!==o)if(o)r.push(o[2]);else if(/^(303|532)$/.test(t))e[t]=0;else{var n=new Promise(((r,n)=>o=e[t]=[r,n]));r.push(o[2]=n);var a=f.p+f.u(t),c=new Error;f.l(a,(r=>{if(f.o(e,t)&&(0!==(o=e[t])&&(e[t]=void 0),o)){var n=r&&("load"===r.type?"missing":r.type),a=r&&r.target&&r.target.src;c.message="Loading chunk "+t+" failed.\n("+n+": "+a+")",c.name="ChunkLoadError",c.type=n,c.request=a,o[1](c)}}),"chunk-"+t,t)}},f.O.j=t=>0===e[t];var t=(t,r)=>{var o,n,a=r[0],c=r[1],i=r[2],d=0;if(a.some((t=>0!==e[t]))){for(o in c)f.o(c,o)&&(f.m[o]=c[o]);if(i)var s=i(f)}for(t&&t(r);d{"use strict";var e,t,r,o,n,a={},c={};function i(e){var t=c[e];if(void 0!==t)return t.exports;var r=c[e]={id:e,loaded:!1,exports:{}};return a[e].call(r.exports,r,r.exports,i),r.loaded=!0,r.exports}i.m=a,i.c=c,e=[],i.O=(t,r,o,n)=>{if(!r){var a=1/0;for(s=0;s=n)&&Object.keys(i.O).every((e=>i.O[e](r[f])))?r.splice(f--,1):(c=!1,n0&&e[s-1][2]>n;s--)e[s]=e[s-1];e[s]=[r,o,n]},i.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return i.d(t,{a:t}),t},r=Object.getPrototypeOf?e=>Object.getPrototypeOf(e):e=>e.__proto__,i.t=function(e,o){if(1&o&&(e=this(e)),8&o)return e;if("object"==typeof e&&e){if(4&o&&e.__esModule)return e;if(16&o&&"function"==typeof e.then)return e}var n=Object.create(null);i.r(n);var a={};t=t||[null,r({}),r([]),r(r)];for(var c=2&o&&e;"object"==typeof c&&!~t.indexOf(c);c=r(c))Object.getOwnPropertyNames(c).forEach((t=>a[t]=()=>e[t]));return a.default=()=>e,i.d(n,a),n},i.d=(e,t)=>{for(var r in t)i.o(t,r)&&!i.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},i.f={},i.e=e=>Promise.all(Object.keys(i.f).reduce(((t,r)=>(i.f[r](e,t),t)),[])),i.u=e=>"assets/js/"+({53:"935f2afb",85:"1f391b9e",162:"d589d3a7",173:"d167c9fe",195:"c4f5d8e4",414:"393be207",514:"1be78505",516:"a5f93cd8",592:"common",599:"e833177e",918:"17896441"}[e]||e)+"."+{53:"d1edc687",85:"55e6ef7a",162:"ced7c932",173:"a41f6225",195:"e8097e42",414:"90c32b60",514:"d591cc98",516:"911fcd82",592:"ce3b74b1",599:"64c2ed9a",608:"7a1dfb64",918:"62b9449c",933:"74580eb2"}[e]+".js",i.miniCssF=e=>"assets/css/styles.670ddddb.css",i.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),i.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),o={},n="docs:",i.l=(e,t,r,a)=>{if(o[e])o[e].push(t);else{var c,f;if(void 0!==r)for(var d=document.getElementsByTagName("script"),s=0;s{c.onerror=c.onload=null,clearTimeout(p);var n=o[e];if(delete o[e],c.parentNode&&c.parentNode.removeChild(c),n&&n.forEach((e=>e(r))),t)return t(r)},p=setTimeout(u.bind(null,void 0,{type:"timeout",target:c}),12e4);c.onerror=u.bind(null,c.onerror),c.onload=u.bind(null,c.onload),f&&document.head.appendChild(c)}},i.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.p="/react-native-template/",i.gca=function(e){return e={17896441:"918","935f2afb":"53","1f391b9e":"85",d589d3a7:"162",d167c9fe:"173",c4f5d8e4:"195","393be207":"414","1be78505":"514",a5f93cd8:"516",common:"592",e833177e:"599"}[e]||e,i.p+i.u(e)},(()=>{var e={303:0,532:0};i.f.j=(t,r)=>{var o=i.o(e,t)?e[t]:void 0;if(0!==o)if(o)r.push(o[2]);else if(/^(303|532)$/.test(t))e[t]=0;else{var n=new Promise(((r,n)=>o=e[t]=[r,n]));r.push(o[2]=n);var a=i.p+i.u(t),c=new Error;i.l(a,(r=>{if(i.o(e,t)&&(0!==(o=e[t])&&(e[t]=void 0),o)){var n=r&&("load"===r.type?"missing":r.type),a=r&&r.target&&r.target.src;c.message="Loading chunk "+t+" failed.\n("+n+": "+a+")",c.name="ChunkLoadError",c.type=n,c.request=a,o[1](c)}}),"chunk-"+t,t)}},i.O.j=t=>0===e[t];var t=(t,r)=>{var o,n,a=r[0],c=r[1],f=r[2],d=0;if(a.some((t=>0!==e[t]))){for(o in c)i.o(c,o)&&(i.m[o]=c[o]);if(f)var s=f(i)}for(t&&t(r);d Getting Started | React Native Template - +
-

Getting Started

Prerequisite#

  1. Make sure that you have followed the environment setup instructions properly from the official React Native docs.

  2. Make sure that your Cocoapods version is >= 3.5.7. If its lower than 3.5.7, you can update it using the following command:

sudo gem install cocoapods
  1. The installation command will fail if you have the global legacy react-native-cli installed in your machine. Make sure you uninstall it first:
yarn global remove react-native-cli

or if using npm

npm uninstall -g react-native-cli

Initialising#

Generate a new React Native(v0.74) app using the @ajaysidhu/react-native-template:

npx react-native init myapp --template @ajaysidhu/react-native-template --skip-install --pm npm --skip-git-init

You might also be prompted to confirm the installation for the packages react-native and husky. Simply hit enter to proceed.

The template will automatically install the npm dependencies and the pods (if you are on the MacOS).

Install from GitHub#

If you want to use the template directly from the GitHub or try out the latest features which are not release to the npm yet, then you can run:

npx react-native init myapp --template https://github.com/ajaykumar97/react-native-template.git --skip-install --pm npm --skip-git-init

Notes#

  1. Starting React Native v0.74, Xcode does not start Metro bundler automatically. If you are running the app from the XCode, please make sure that your metro bundler is running before running the build from XCode. You can start the metro bundler by running the following command in the root directory of your newly created project using this template:
npm start
  1. Minimum supported versions:
  • iOS: 15
  • Android: 26

Use Older versions#

If you want to use an older version of the template, then you can run(replace version with your desired version):

npx react-native init myapp --template @ajaysidhu/react-native-template@version --skip-install --pm npm --skip-git-init

You can look at all versions, that I have published here.

Configure Google Service Files#

If you want to extend the setup further to configure different Google Service files for Development, Testing, Staging and Production environments, you can follow my this Medium post.

Make your own template#

Enjoying this awesome template feature of react-native-cli and want to build your own react-native-template? No worries! I have written a dedicated post to create your own react-native-template based your own project needs. You can give it a read here.

Need further help?#

Thank you for choosing our React Native Template for your mobile app development needs. We're thrilled to contribute to your project's success!

Should you encounter any issues, have questions, or need further assistance using our package to initialise your new mobile app, please don't hesitate to reach out. Our team at Diligentic Infotech is here to help you every step of the way.

Feel free to visit our website Diligentic Infotech to learn more about our services and how we can support your mobile app development journey.

Happy coding, and we look forward to hearing from you!

Roadmap#

  • Add react-native-keychain for secured user data storage
  • Add dark mode
  • Add docs to explain provided common components usages
  • Add atomic structure for components
  • Add common styles
  • Add website docs versioning
  • Add RTL languages support
- +

Getting Started

Prerequisite#

  1. Make sure that you have followed the environment setup instructions properly from the official React Native docs.

  2. Make sure that your Cocoapods version is >= 3.5.7. If its lower than 3.5.7, you can update it using the following command:

sudo gem install cocoapods
  1. The installation command will fail if you have the global legacy react-native-cli installed in your machine. Make sure you uninstall it first:
yarn global remove react-native-cli

or if using npm

npm uninstall -g react-native-cli

Initialising#

Generate a new React Native(v0.75) app using the @ajaysidhu/react-native-template:

npx react-native init myapp --template @ajaysidhu/react-native-template --skip-install --pm npm --skip-git-init

You might also be prompted to confirm the installation for the packages react-native and husky. Simply hit enter to proceed.

The template will automatically install the npm dependencies and the pods (if you are on the MacOS).

Install from GitHub#

If you want to use the template directly from the GitHub or try out the latest features which are not release to the npm yet, then you can run:

npx react-native init myapp --template https://github.com/ajaykumar97/react-native-template.git --skip-install --pm npm --skip-git-init

Notes#

  1. Starting React Native v0.74, Xcode does not start Metro bundler automatically. If you are running the app from the XCode, please make sure that your metro bundler is running before running the build from XCode. You can start the metro bundler by running the following command in the root directory of your newly created project using this template:
npm start
  1. Minimum supported versions:
  • iOS: 15
  • Android: 26

Use Older versions#

If you want to use an older version of the template, then you can run(replace version with your desired version):

npx react-native init myapp --template @ajaysidhu/react-native-template@version --skip-install --pm npm --skip-git-init

You can look at all versions, that I have published here.

Configure Google Service Files#

If you want to extend the setup further to configure different Google Service files for Development, Testing, Staging and Production environments, you can follow my this Medium post.

Make your own template#

Enjoying this awesome template feature of react-native-cli and want to build your own react-native-template? No worries! I have written a dedicated post to create your own react-native-template based your own project needs. You can give it a read here.

Need further help?#

Thank you for choosing our React Native Template for your mobile app development needs. We're thrilled to contribute to your project's success!

Should you encounter any issues, have questions, or need further assistance using our package to initialise your new mobile app, please don't hesitate to reach out. Our team at Diligentic Infotech is here to help you every step of the way.

Feel free to visit our website Diligentic Infotech to learn more about our services and how we can support your mobile app development journey.

Happy coding, and we look forward to hearing from you!

Roadmap#

  • Add react-native-keychain for secured user data storage
  • Add dark mode
  • Add docs to explain provided common components usages
  • Add atomic structure for components
  • Add common styles
  • Add website docs versioning
  • Add RTL languages support
+ \ No newline at end of file diff --git a/docs/key-features/index.html b/docs/key-features/index.html index 5781f2f..4c00831 100644 --- a/docs/key-features/index.html +++ b/docs/key-features/index.html @@ -5,13 +5,13 @@ Key Features | React Native Template - +

Key Features

- + \ No newline at end of file diff --git a/docs/project-structure/index.html b/docs/project-structure/index.html index e224c93..2b1b29a 100644 --- a/docs/project-structure/index.html +++ b/docs/project-structure/index.html @@ -5,13 +5,13 @@ Project Structure | React Native Template - +

Project Structure

rootโ”œโ”€โ”€ .huskyโ”œโ”€โ”€ __tests__โ”œโ”€โ”€ androidโ”œโ”€โ”€ iosโ”œโ”€โ”€ node_modulesโ”œโ”€โ”€ scriptsโ”‚   โ””โ”€โ”€ runPostInstallUninstallTasks.jsโ”œโ”€โ”€ srcโ”‚ย ย  โ”œโ”€โ”€ assetsโ”‚ย ย  โ”‚   โ”œโ”€โ”€ fontsโ”‚ย ย  โ”‚   โ””โ”€โ”€ iconsโ”‚ย ย  โ”œโ”€โ”€ commonComponentsโ”‚ย ย  โ”œโ”€โ”€ localization|   |   โ”œโ”€โ”€ en.json|   |   โ””โ”€โ”€ index.tsxโ”‚ย ย  โ”œโ”€โ”€ navigationโ”‚ย ย  โ”‚   โ”œโ”€โ”€ AppNavigator.tsxโ”‚ย ย  โ”‚   โ”œโ”€โ”€ AuthNavigator.tsxโ”‚ย ย  โ”‚   โ””โ”€โ”€ MainNavigator.tsxโ”‚ย ย  โ”œโ”€โ”€ screensโ”‚   โ”‚   โ”œโ”€โ”€ AuthScreensโ”‚   โ”‚   โ””โ”€โ”€ MainAppScreensโ”‚ย ย  โ”œโ”€โ”€ storeโ”‚   โ”‚   โ”œโ”€โ”€ index.tsxโ”‚   โ”‚   โ””โ”€โ”€ reducers.tsxโ”‚   โ”œโ”€โ”€ utilitiesโ”‚   โ”‚   โ”œโ”€โ”€ constantsโ”‚   โ”‚   โ”œโ”€โ”€ helperFunctionsโ”‚   โ”‚   โ”œโ”€โ”€ layout.tsxโ”‚   โ”‚   โ”œโ”€โ”€ logger.tsxโ”‚   โ”‚   โ”œโ”€โ”€ navigationService.tsxโ”‚   โ”‚   โ””โ”€โ”€ request.tsxโ”‚   โ””โ”€โ”€ App.tsxโ”œโ”€โ”€ .env.developmentโ”œโ”€โ”€ .env.productionโ”œโ”€โ”€ .env.stagingโ”œโ”€โ”€ .env.templateโ”œโ”€โ”€ .env.testingโ”œโ”€โ”€ index.jsโ”œโ”€โ”€ react-native.config.jsโ””โ”€โ”€ package.json
- + \ No newline at end of file diff --git a/docs/scripts/index.html b/docs/scripts/index.html index 19902f6..355eb36 100644 --- a/docs/scripts/index.html +++ b/docs/scripts/index.html @@ -5,13 +5,13 @@ Scripts | React Native Template - +

Scripts

The scripts section of the package.json contains few handy scripts to automate some common operations. You can run any of the desired script like:

npm run <script-name>

For example, to run androidStagingDebug:

npm run androidStagingDebug

or, using npm:

npm run androidStagingDebug

androidDevelopmentDebug#

It will run the debug android build with development varient.

androidTestingDebug#

It will run the debug android build with testing varient.

androidStagingDebug#

It will run the debug android build with staging varient.

androidProductionDebug#

It will run the debug android build with production varient.

iosDevelopmentDebug#

It will run the debug iOS build with development scheme.

iosTestingDebug#

It will run the debug iOS build with testing scheme.

iosStagingDebug#

It will run the debug iOS build with staging scheme.

iosProductionDebug#

It will run the debug iOS build with production scheme.

start#

It will start the Metro Bundler.

test#

It will run all of the test cases.

test:watch#

It will run the all of the test cases or the specified test case(after the test command) in watch mode. It will automatically re-run the test cases if any of the test case or the .js file will be changed.

lint#

It will check the whole codebase for the lint issues.

postinstall#

These are the set of tasks which will run after every dependency installation. These tasks are:

  • If you are running the project on MacOS, the it will automatically install the pods in the ios directory. If you are not on a MacOS machine, then it will skip the installing the pods.

uninstall#

It will run all of the tasks mentioned in the postinstall script above after uninstalling any dependency.

- + \ No newline at end of file diff --git a/index.html b/index.html index 5939238..eaa89d5 100644 --- a/index.html +++ b/index.html @@ -5,13 +5,13 @@ Docs of React Native Template | React Native Template - +

React Native Template

Reduce project initialization time by 90%

IfItDoesntMatchAnyMedia
Getting Started
- + \ No newline at end of file diff --git a/markdown-page/index.html b/markdown-page/index.html index 5a1fac8..7580245 100644 --- a/markdown-page/index.html +++ b/markdown-page/index.html @@ -5,13 +5,13 @@ Markdown page example | React Native Template - +

Markdown page example

You don't need React to write simple standalone pages.

- + \ No newline at end of file