To run this project locally, make sure to: yarn install or npm install
and yarn build
!
This is the final project for The Udacity Google Scholarship!
- Dynamically set the size of the table as an N by M grid.
- Choose a color.
- Click a cell in the grid to fill that cell with the chosen color.
- Implement a
makeGrid()
function, that dynamically creates a grid that the user can interact with. - Implement while and for loops to clear and create the grid dynamically
- Code project with vanilla JS (as opposed to jQuery)
- Do not use starter files the course provides
- Use CSS Grid for layout (using FlexBox for grid items is ok)
As an extra challenge to myself, I decided set up a dev environment and not rely on CodePen's convenience for the sake of avoiding webpack. I successfully set up my environment to transpile ES6 to ES5, compile Sass to CSS, and automatically update my HTML and pop it into my dist
folder with the updated links to my JS and CSS. I am absolutely ecstatic to create this environment. Webpack has always been intimidating to me - and to be quite honest - it still is. I am happy to have pushed through and do it! With lots of googling and tutorials, I was able to figure it out and understand what exactly is going on. Webpack is still tough though, and I agree it's not user friendly as there are so many dependencies upon dependencies to install, and don't forget the plugins that rely on those dependencies! It gave me great perspective on the growing pains of Webpack!