(building a month calendar with || learning) React.
An example project that explores various *React concepts and serves as an example for learning purposes.
...go play with the live examples via Storybook: https://erikthedeveloper.github.io/react-calendar-components/
- Higher order components
- Render callbacks (aka function as children)
- Composing behavior from multiple higher order components
- Built with create-react-app
- Writing UI stories with Storybook
- [TODO] ...
- Writing tests with Jest
- BEM (aka you might not need SASS)
- Flexbox (on a basic level)
- [TODO] ...
To summarize the overall approach used and application:
Calendarwith desired features via applying related higher order components. These can be applied either singly (example) or by combining multiple (example)
Calendarhigher order component is intended to be composable. This is primarily enabled through treating
Dayas a Component as prop...
- ...and having each
CalendarHoC "enhance" its own
props.DayComponent(also via composing higher order components) see this usage
EnhanceDayrender callback component ensures that each Calendar's
props.DayComponentis only enhanced as-needed. More generally this enables deriving/computing properties from
propswhile avoiding the computed values becoming stale.
git clone firstname.lastname@example.org:erikthedeveloper/react-calendar-components.git cd react-calendar-components yarn install yarn start
You should now be able to view the Storybook on your http://localhost:9009/.