ahmedalatawi / react-event-scheduler

Fullstack React app built with Typescript, Bootstrap, Apollo client/server, NodeJS/Express, and MongoDB/mongoose

React Event Scheduler App

This project was bootstrapped with Create React App.

Event Scheduler is a React app that allows users to create events. An event can be anything, such as a sport event, team meeting, party announcement, personal advertisement, etc. An event consists of title, start and end date/time, and description. Events can also be shared on FB or Twitter. All events are public by default (visible to everyone). They can also be private (only visible to you) by checking the private checkbox.

Demo 🎥

If you're looking for a backend starter project with NodeJS, GraphQL, TypeScript, MongoDB and Prisma, check this out.

Tech Stack

Frontend

• React (react hooks)
• Typescript
• Bootstrap/react-bootstrap
• Styled components
• Apollo client
• JS cookie

Backend

• NodeJS with Express
• Typescript
• Apollo server express
• JSON web token
• MongoDB with mongoose

Note that graphql schemas are generated on the frontend using GraphQL Code Generator. This means that if you make any changes to the schema (server/graphql/schema/index.ts), make sure that the .graphql files in the frontend are also updated accordingly.

Next, run yarn codegen to re-generate the queries and mutations (Note: before you do this, make sure the server is up and running by either running yarn start or yarn start:server)

Run app locally

Make sure MongoDB is up and running

In the project directory, run yarn, then:

yarn start

Runs the backend and frontend apps simultaneously in the development mode.\

Or if you prefer running the apps separately by running start:web and start:server in separate terminals.

Open http://localhost:3000 to view it in the browser.

The page will reload if you make changes.
You will also see any lint errors in the console.

Current functionality

• User signup and login
• Create, update and delete events
• Search & pagination
• Make events as private (only visible to creators)
• Session expiry warning (displayed when being idle for 3 minutes after logging in)
• Share events with family & friends on Facebook and Twitter

Coming soon

• User profile
• Admin tab & profile

Run unit tests

coming soon...

Run E2E tests

coming soon...

Author 📚

Ahmed Alatawi

react-event-scheduler's Issues

Dependency Dashboard

This issue provides visibility into Renovate updates and their statuses. Learn more

Rate Limited

These updates are currently rate limited. Click on a checkbox below to force their creation now.

• Update dependency @types/node to v12.20.55
• Update dependency @types/react to v17.0.47
• Update dependency @types/react-dom to v17.0.17
• Update dependency react-error-overlay to v6.0.11
• Update dependency typescript to v4.7.4
• Update dependency mongoose to v6.4.0
• Update dependency prettier to v2.7.1
• Update graphqlcodegenerator monorepo (@graphql-codegen/typescript, @graphql-codegen/typescript-operations, @graphql-codegen/typescript-react-apollo, @graphql-codegen/typescript-resolvers)
• Update actions/checkout action to v3
• Update actions/setup-node action to v3
• Update dependency @types/react-test-renderer to v18
• Update dependency react-idle-timer to v5
• Update dependency react-scripts to v5
• Update dependency ts-node-dev to v2
• Update dependency web-vitals to v2
• Update react monorepo to v18 (major) (react, react-dom, react-test-renderer)

Open

These updates have all been created already. Click a checkbox below to force a retry/rebase of any.

• Pin dependencies (@fullcalendar/daygrid, @fullcalendar/interaction, @fullcalendar/react, @fullcalendar/timegrid, @graphql-codegen/cli, @testing-library/jest-dom, @testing-library/react, @testing-library/user-event, @types/bcryptjs, @types/bootstrap, @types/compression, @types/cookie-parser, @types/cors, @types/express, @types/graphql, @types/jest, @types/jquery, @types/js-cookie, @types/jsonwebtoken, @types/mongoose, @types/react, @types/react-bootstrap-table-next, @types/react-bootstrap-table2-filter, @types/react-bootstrap-table2-toolkit, @types/react-dom, @types/react-test-renderer, @types/styled-components, bcryptjs, body-parser, bootstrap, compression, concurrently, cookie-parser, cors, dataloader, dotenv, express, express-sslify, graphql, husky, jquery, js-cookie, jsonwebtoken, mongoose, npm-run-all, pretty-quick, react, react-bootstrap, react-bootstrap-table-next, react-bootstrap-table2-filter, react-bootstrap-table2-toolkit, react-darkreader, react-dom, react-icons, react-idle-timer, react-router, react-router-dom, react-scripts, react-share, react-test-renderer, styled-components, ts-node, ts-node-dev, typescript, wait-on, web-vitals)
• Pin dependencies (@apollo/client, apollo-server-express)
• Update dependency @testing-library/react to v13
• Update dependency @testing-library/user-event to v14
• Update dependency @types/jest to v28
• Update dependency @types/node to v16
• Update dependency @types/react to v18
• Update dependency @types/react-dom to v18
• Update dependency concurrently to v7
• Update dependency husky to v8
• Click on this checkbox to rebase all open PRs at once

Detected dependencies

github-actions

.github/workflows/main.yml

• actions/checkout v2
• actions/setup-node v1

npm

package.json

• @types/styled-components ^5.1.25
• apollo-server-express ^3.9.0
• bcryptjs ^2.4.3
• body-parser ^1.19.0
• compression ^1.7.4
• concurrently ^6.4.0
• cookie-parser ^1.4.6
• cors ^2.8.5
• dataloader ^2.0.0
• dotenv ^16.0.1
• express ^4.17.1
• express-sslify ^1.2.0
• graphql ^16.5.0
• js-cookie ^3.0.1
• jsonwebtoken ^8.5.1
• mongoose ^6.3.8
• react ^17.0.2
• react-bootstrap ^2.4.0
• react-bootstrap-table-next ^4.0.3
• react-bootstrap-table2-filter ^1.3.3
• react-bootstrap-table2-toolkit ^2.1.3
• react-darkreader ^1.5.6
• react-dom ^17.0.2
• react-icons ^4.4.0
• react-idle-timer ^4.6.4
• react-router ^6.0.2
• react-router-dom ^6.0.2
• react-share ^4.4.0
• styled-components ^5.3.5
• ts-node ^10.8.1
• typescript ^4.7.3
• @apollo/client ^3.6.8
• @fullcalendar/daygrid ^5.10.1
• @fullcalendar/interaction ^5.10.1
• @fullcalendar/react ^5.10.1
• @fullcalendar/timegrid ^5.10.1
• @graphql-codegen/cli ^2.6.2
• @graphql-codegen/introspection 2.1.1
• @graphql-codegen/typescript 2.4.11
• @graphql-codegen/typescript-operations 2.4.0
• @graphql-codegen/typescript-react-apollo 3.2.14
• @graphql-codegen/typescript-resolvers 2.6.4
• @testing-library/jest-dom ^5.11.4
• @testing-library/react ^12.0.4
• @testing-library/user-event ^12.1.10
• @types/bcryptjs ^2.4.2
• @types/bootstrap ^5.1.12
• @types/compression ^1.7.2
• @types/cookie-parser ^1.4.2
• @types/cors ^2.8.12
• @types/express ^4.17.13
• @types/graphql ^14.5.0
• @types/jest ^26.0.15
• @types/jquery ^3.5.8
• @types/js-cookie ^3.0.1
• @types/jsonwebtoken ^8.5.6
• @types/mongoose ^5.11.97
• @types/node 12.20.52
• @types/react ^17.0.34
• @types/react-bootstrap-table-next ^4.0.18
• @types/react-bootstrap-table2-filter ^1.3.4
• @types/react-bootstrap-table2-toolkit ^2.1.7
• @types/react-dom ^17.0.0
• @types/react-test-renderer ^17.0.2
• bootstrap ^5.1.3
• husky ^7.0.0
• jquery ^3.6.0
• npm-run-all ^4.1.5
• prettier 2.6.2
• pretty-quick ^3.1.3
• react-error-overlay 6.0.9
• react-scripts ^4.0.3
• react-test-renderer ^17.0.2
• ts-node-dev ^1.1.8
• wait-on ^6.0.0
• web-vitals ^1.0.1
• styled-components ^5
• react-error-overlay 6.0.9

---

• Check this box to trigger a request for Renovate to run again on this repository