see deployed page here.
This static web page was built with react, styled components, and React-scroll. React Router was also set up, but not used to its full capabilities. The page work and design and many code sources were not all from my own, as I give credit to Brian from Codavilla. link: https://www.codavilla.com/posts/react-website-using-styled-components-and-smooth-scroll.
The main problem I encountered was getting a functioning carousel in the final Informational Section of the page. I tried using and reasearching a few different resources. React-Boostrap has its own Carousel component, but I was unable to get the component fit or render properly. Next I tried React-Materialize, then React-Slick, and had the same problem. "Slick" is a carousel that should render dynamically in any container. I tried changing around the sizes and settings of the container, but also to no avail. I wanted to avoid using any jQuery with materialize. I think If i had more time, I would have eventually found a correct resource for this specific type of text-only, minitaure type of carousel that the client requested. A final resort would be to try to hard-coding it in html and css, but I dont think the results would be optimal as a quick react component.
I turned out pretty satisfied with the fonts and colors, and the navbar. The React-scroll allows the page to move smoothly when the nav links are clicked. Also I substitued the hero image for a dynamic mp4, which I think made the page feel more alive. The colors on the nav links animate when selected. The site is also mobile responsive. I think this is an excellent template to use for the future, and was excellent practice for me using and naming compoennts, and writing styled-components.
--Jack Lambert, jacklmbrt07@gmail.com