HeadsUpGuys platform - Module Builder & Dashboard for interactive resource slides
Adil Kapadia Chinemerem Chigbo Christine Ng Daniel Yu 🥑 Het Parikh Jay Bhagat Jennifer Lu Molly Yu Neel Ismail Nim Wijetunga Sharon He Stephanie Xu Tony Zhao Yash Gajaria
To run the application:
# Install dependencies
yarn
# Run locally
yarn devOpen localhost:3000 on your browser to see the result!
- NodeJS application powered by the Next.JS with TypeScript framework.
- Chakra UI along with Storybook.js for frontend components
- Vercel for deployment, with Github Actions for pre-merge workflows
.
├── .babelrc
├── .env # Env vars
├── .eslintignore
├── .eslintrc # Eslint
├── .gitattributes
├── .github
│ └── workflows # Github Deployment workflows
├── .gitignore
├── .next # Next.js generated files
├── .prettierignore
├── .prettierrc
├── .storybook # Storybook.js config files
│ ├── main.js
│ └── preview.js
├── LICENSE
├── README.md
├── __tests__
│ └── index.spec.ts
├── next-env.d.ts
├── next.config.js
├── package.json
├── pages # Pages .../[fileName]
│ ├── _app.tsx
│ ├── _document.tsx
| ├── api/ # Serverless API routes
│ ├── index.tsx # Home page
│ └── protected.tsx # Protected route example
├── public # Assets
│ ├── icons
│ └── meta.json
├── src # Components, styles
│ ├── components
│ ├── definitions
│ └── styles
├── test # Jest setup
│ ├── jest.config.js
│ └── jest.setup.ts
├── tsconfig.json
└── yarn.lockChakra UI is a simple, modular and accessible component library that gives you the building blocks you need to build your React applications.
Next.js comes with built-in support for CSS and styled-jsx. Styled-jsx is full, scoped and component-friendly CSS support for JSX (rendered on the server or the client).
Next.js has a built-in polyfill for the fetch API. You don't need to worry about using it on either server or client side.
Storybook is an open source tool for developing UI components in isolation for React, Vue, Angular, and more. It makes building stunning UIs organized and efficient.
Use environment variables in your next.js project for server side, client or both.
React Hooks library for data fetching from Vercel
A pluggable and configurable linter tool for identifying and reporting on patterns in JavaScript. Maintain your code quality with ease.
An opinionated code formatter; Supports many languages; Integrates with most editors.
The concept of lint-staged is to run configured linter (or other) tasks on files that are staged in git.
Jest is a delightful JavaScript Testing Framework with a focus on simplicity.
GitHub Actions makes it easy to automate all your software workflows, now with world-class CI/CD. Build, test, and deploy your code right from GitHub.
MIT
This project was generated with Superplate.
- Install the Amplify CLI
- No need to configure the CLI- only need it installed
- Once the Amplify CLI is installed run
amplify pull --appId <ASK TEAM LEAD FOR APPID> --envName devto pull the Cognito backend setup locally, this will make sure Amplify is connecting to the correct user pool- Select
AWS access keysfor authentication method - accessKeyId:
<ASK TEAM LEAD> - secretAccessKey:
<ASK TEAM LEAD> - region:
ca-central-1 - Should see the following message:
Amplify AppID found: XXXXXXXX. Amplify App name is: headsupguys Backend environment dev found in Amplify Console app: headsupguys - Choose your default editor (after this step most of the defaults should be good)
- type of app building:
javascript - framework:
react - source directory path:
src - distribution directory path:
build - Build Command:
npm run-script build - Start Command:
npm run-script start - Do you plan on modifying this backend?
Y
- Select
- Run the
amplify pullcommand - Verify your installation: Under the
srcdirectory you should seeaws-exports.jsand you should see anamplifydirectory