Hello and welcome to the Github repo of my React and React Native Projects. This houses all the related projects I created as well as the source codes of each project. Each project is branched from this master file. You can click on the branch tab to view all the listed projects or you can scroll from this page to view the rest of the projects.
The projects are listed from the latest. ⬆️
20. Currency Converter in full webite
In this project, I have created a full website application from the currency app that I have created on the two project. This website is fully responsive and it is also using the React Router to its navigation. This webapp is also using API Frankfurter and Rest Countries APIs. I also sketched designed the app using Figma.
View it live from your browser. Deployed with Firebase
View project source code.
Watch Short Video Clip
19. Currency Calculator App
From the last project, I added a React Router and integrated a currency calculator app for this project. Thank you for looking into this repo. All the data from this app are taken from API Frankfurter and Rest Countries.
View it live from your browser. Deployed with Firebase
View project source code.
Watch Short Video Clip
18. Currency Converter
Currency converter app are one of the app ideas that really interests me most. I build this app to see how does the currency app works under the hood. Thank you for looking into this repo. All the data from this app are taken from API Frankfurter and Rest Countries.
View it live from your browser. Deployed with Firebase
View project source code.
Watch Short Video Clip
17. Gradient and Animation
In this app I am making a simple TodoList that renders animation using CSSTransition and TransitionGroup library from ReactJS and with diffent background for each list to generate a gradient look list.
View it live from your browser. Deployed with Firebase
View project source code.
Watch Short Video Clip
16. Book Searcher
I created this website to help users search for books they want to read. All the books datta from this app are taken from Google Books. It contains a huge amount of data about retailed books and publications and it is free to use.
View it live from your browser. Deployed with Firebase
View project source code.
Watch Short Video Clip
15. Photo Searcher
I want to create an app that searches photos on the internet. I found Pexels.com a free stock photos you can query for free. So I decided to build one app like this.
View it live from your browser. Deployed with Firebase
View project source code.
Watch Short Video Clip
14. Some Animation
Animations are one of the important things that bring more life to your website. So I have decided to create this app with some animations. I am using React Reveal a lightweight react animation library.
View it live from your browser. Deployed with Firebase
View project source code.
Watch Short Video Clip
13. Twitter Hashtag Searcher
This app allows the user to search hashtagged words from Twitter. The app requires APIKeys and Access Token provided by Twitter.
View it live from your browser. Deployed with Firebase
View project source code.
Watch Short Video Clip
12. Giff Searcher
This is a ReactJS website is allow the user to search giff images and files. It uses the Giphy API, an online database and search engine that allows users to search for and share short looping videos with no sound, that resemble animated GIF files.
View it live from your browser. Deployed with Firebase
View project source code.
Watch Short Video Clip
11. Knowledge Quiz
This app is a knowledge quiz app. It asks quiestions about general informations and you just have to pick you answers from the options provided. It uses its data from Open Trivia Database - an open source database
View it live from your browser. Deployed with Firebase
View project source code.
Watch Short Video Clip
10. Tralse Quiz
This is a True or False App. It is run on a ReactJS. It is an app that allows the user to play a true or false quiz about general informations about science, math, sports, music, politics, history, etc. This app uses resources Open Trivia Database. A free JSON API for programming projects. It does not require API tokens when you use it.
View it live from your browser. Deployed with Firebase
View project source code.
Watch Short Video Clip
09. Video Search
This is a Movie Searcher App. It allows the user to search movies and informations relation about the searched movie. This app uses The Movie DB API to query data about movies. It also uses Axios, a Promised Based HTTP module for NodeJS. MovieDB have so many API's that you can use to query informations about movies. It gives the developer a free API Key
View it live from your browser. Deployed with Firebase
View project source code.
Watch Short Video Clip
08. Multi-todo List App
Todo List App is very common programming exercises. I am building this app and want to make it something different. It is a list of todo-list. It allows you to create multiple todo-list with the same functionality. This app is a MERN Stack App.
View it from your browser. Deployed at Heroku.
View project source code.
Watch Short Video Clip.
07. Weather App
This is a simple weather app that allows you to check weather conditions from any city you want. You can type any city and it will provide the latest weather of that city you entered. The resources from this app are from OpenWeatherMap.
View it from your browser. Deployed at firebase.
View project source code.
Watch Short Video Clip.
06. Barcode Scanner
Barcode scanners are one of the applications that amazes me. So, I have decided to create one. This is app allows you to scan barcodes directly from the user's browser. The app is using Quagga a javascript library that streams the user's camera and then searches for any barcodes rendered from the streamed video. The app fetches data from Barcode API and then returns product information related to the barcode.
View it from your browser. Deployed on Firebase.
05. Camera of React Native
I was trying to play some api's where I can render a real camera with React Native Camera and store images to cloud storage using Google Firebase and store all images data so that the user can access all the information. I was very excited creating this app. In this project, I learned how to set up a native app using camera and how to build a cloud data storage.
04. Maps of React Native
I wanted to make an application that renders Google Maps so I made this application that renders maps on a mobile device. I had so much fun building this application and I learned how to render map components using MapView and the properties that are needed for the map to render. I also learned how to create map markers using MapView.Marker and animate the markers when a new location is selected. I also learned how to Polygons and Polylines. This can be very useful for projects that needs map components.
03. Animations of React Native
I was playing with React Native Animation library for this project and I learned a lot from it. In this project I learned configure animation using Animate.timing() and how to compose animation methods. I also explored how to combine animations values and how to modify the segments of the animation using interpolate() and use it to built in methods like transform, translate, scale.
02. Exploring React Native Navigation
This challenge deepens my understanding of Navigation functions of React Native Navigation version 3.x. Creating tabs using creareStackNavigator, createSwitchNavigator, createBottomTabNavigator, createAppContainer, and createDrawerNavigator are some of the few things I was exploring in this project.
01. Photo Sharing App
This is a full
React Native project I took from Udemy. The course covers a lot of React Native fundamentals from Component rendering, Navigation and Routers, Animation, Styling, Redux, State and Props and many more like
Redux and Firebase. The course also covers other libraries like Icons, Camera Detection and Geolocations. I have learned a lot in this course and it has broaden my knowledge about this framework. View project source code.
Aimanski12. Thank you very very much for giving this project a ⭐
Copyright © 2019, Aimanski12. Released under the MIT License.