Gardening App in ReactJS

I have decided to branch out and recreate my Gardening App using ReactJS. I have a basic understanding of JavaScript and have built websites using HTML and CSS. I was pleasantly surprised with how much easier ReachJS made my experience, particularly with the markup languages. My first step is to create the app as a website and then potentially migrate to a mobile app. Although I believe that my favorite coding experience has been with Python, I am having trouble finding a job with my current resume and am looking for a new challenge and to build new skills. So far, I’ve created components for all the parts of my app. Below are my App.js, an example component and the resulting webpage. I’ve started by displaying most components immediately and will work later to show/hide them when necessary.

I’m also in the middle of a ReactJS course and will modify/improve the app as I learn more.


import './App.css';
import Navigation from "./components/Navigation";
import GardenDisplay from './components/GardenDisplay';
import AddGarden from './components/AddOrEdit/AddGarden';
import AddPlant from './components/AddOrEdit/AddPlant';
import ConfirmInfo from './components/AddOrEdit/ConfirmInfo';
import SearchPlants from './components/SearchPlants';
import Update from './components/Update';
import Results from './components/Results';
import PlantDisplay from './components/PlantDisplay';
function App() {return (
<div className="App">
<h2>Your Gardens</h2> <Navigation /> <GardenDisplay /> <AddGarden /> <AddPlant /> <ConfirmInfo /> <SearchPlants /> <Update /> <Results /> <PlantDisplay />
{/* display garden and plant info screen
database logic*/}
</div> );}export default App;


Webpage snippet



Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store