UPDATE: I am now using the following package to achieve the effect I desired in this post. https://www.npmjs.com/package/scroll-to-element It works quite well and is easy to implement. Read this post about how I have implemented it on www.burtonmediainc.com
Now that I am all finished the Complete React Web Developer Course I am looking to practice my skills and refine my workflow. I have a great boilerplate from the course to get me started. I think I will use it for now since I am familiar with it but I feel like going forward I may switch to using create-react-app since it appears to be more standard.
I need a page for an upcoming workshop that I am going to be running and I figured this would be a perfect opportunity to play. The page will be super simple, in fact I will likely create a basic HTML / JS / CSS version of the page as I develop because I will need to start advertising quicker then I will be done playing! But that will hopefully help in the development workflow.
The page will consist of full-page panels, a fixed navigation and a registration form. The format will be as follows:
Fixed Navigation – Scrolls with the page, changes from white to dark text depending on which panel it is on.
Header – A full screen video background with the name of the workshop, a brief description and a button to register.
Workshop – A section with information about the workshop, what you will learn, what tools we will use etc.
Time & Location – Logistics about when and where the workshop will be hosted. Will include a map.
Register – The registration form, will allow for payment online or the option to pay at the door. This first workshop is only going to be $20 and will hopefully lead to further, more advanced workshops.
Contributions / Comments / Questions
Feel free to use this code for any of your own projects. If you would like to contribute to this project please comment here or contact me.
I would love to see any of your own projects made with this code!