Skip to content

ErdalNayir/CyCamp-FrontEnd

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

11 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

CyCamp - Front-End

I have created a website where you can share bike routes, walk routes and camp area like bikemap. You can share new routes as well as You can comment the existing routes! I was heavily inspired by facebook and instagram while I was creating this website.

What I have learned and used so far

React

  • Functional and Class Components
  • React Hooks(useState, useEffect,useReducer,useNavigate)
  • Props
  • JSX
  • React-Leafet (map provider for web applications for react)
  • React-leaflet layers (for adding satellite and map display to map)
  • Fetch API
  • Component(Creating custom components)
  • Context(I have searched this while I was creating that website)
  • Fragments
  • CSS Module

CSS

  • @media tags
  • How to use " > " in my css file
  • @keyframes (for creating animations)
  • Flex, overflow, transition, z-index and so on

JS

  • Leaflet(map provider for web applications)
  • geoman-leaflet plugin(for modifying like creating polygons and polylines etc.)
  • leaflet easybutton (for creating our custom buttons to customize map)
  • leaflet fullscreen plugin (for displaying map in fullscreen)
  • Async and await

Boostrap 5

  • Grid system of boostrap
  • Boostrap for react
  • I have improved my exsiting knowledge about boostrap 5

MUI (Material UI)

  • Tabs
  • Avatar
  • IconButton
  • Icons
  • Text Field
  • Buttons
  • Carousel

Other Technologies that I have learned

  • react-modals
  • postegre SQL (I have learned some basic things)
  • Web API (.Net Core)
  • Animate on Scroll
  • react-counter and visibilty sensor

Known Issues and bugs.

On mobile phones, there are some error. Unfortunetly it is my first react experience which is I have used react for the first time in my life so I have made some mistakes on routing one page to another. Even though I tried to create responsive design, There are some errors because I didn't use any frameworks or library on some pages or sections. I have tried to provide responsive desing with my own css and html knowledge. I have learned many things about react and css.