Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/operationcode/front-end

Operation Code's website
https://github.com/operationcode/front-end

beginner-friendly css cypress hacktoberfest hacktoberfest2017 hacktoberfest2018 hacktoberfest2019 hacktoberfest2020 jest next postcss react storybook

Last synced: 6 days ago
JSON representation

Operation Code's website

Host: GitHub
URL: https://github.com/operationcode/front-end
Owner: OperationCode
License: mit
Created: 2018-06-02T01:23:17.000Z (over 6 years ago)
Default Branch: main
Last Pushed: 2024-10-29T16:14:09.000Z (14 days ago)
Last Synced: 2024-11-05T06:24:18.129Z (8 days ago)
Topics: beginner-friendly, css, cypress, hacktoberfest, hacktoberfest2017, hacktoberfest2018, hacktoberfest2019, hacktoberfest2020, jest, next, postcss, react, storybook
Language: JavaScript
Homepage: https://operationcode.org
Size: 55.5 MB
Stars: 371
Watchers: 28
Forks: 267
Open Issues: 18
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md

Awesome Lists containing this project

README

        ![](https://operation-code-assets.s3.us-east-2.amazonaws.com/branding/logos/large-blue-logo.png)

[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](https://opensource.org/licenses/MIT)

[![Twitter Follow](https://img.shields.io/twitter/follow/operation_code.svg?style=social&label=Follow&style=social)](https://twitter.com/operation_code)

[![CircleCI](https://circleci.com/gh/OperationCode/front-end/tree/main.svg?style=svg)](https://circleci.com/gh/OperationCode/front-end/tree/main)

[![Maintainability](https://api.codeclimate.com/v1/badges/5010b82ce5d8e319a597/maintainability)](https://codeclimate.com/github/OperationCode/front-end/maintainability)

[![Cypress.io tests](https://img.shields.io/badge/cypress.io-tests-green.svg?style=flat-square)](https://cypress.io)

[See unblocked, unassigned issues](https://github.com/OperationCode/front-end/issues?q=is%3Aopen+is%3Aissue+-label%3A%22Status%3A+Blocked%22+no%3Aassignee). We love our labels - feel free to filter issues to find what you want to work on.

# Welcome!

This is the front-end application for [OperationCode](https://operationcode.org). We highly recommend [joining our organization](https://operationcode.org/join) to receive an invite to our Slack team. After registering, you'll receive a Slack invite via email and will want to join the `#oc-projects` channel. You can get help from multiple professional developers, including people who have worked on the application since day 1!

Before contributing, please review our [Contributing Guide](CONTRIBUTING.md).




Designers, please review our [Contributing Guide for Designers](CONTRIBUTING_TO_DESIGN.md)

## Quick Start

If you're unsure of how to start this app or code for it, don't worry! You're our target audience!

Please read our [Contributing Guide](CONTRIBUTING.md) to learn everything you need to be able to ask the right questions on our Slack team.

**In continuing with the quick start instructions, it is assumed that you are no stranger to React applications, the JavaScript ecosystem, and standard GitHub workflows such as forking, cloning, and branching.**

Our entire UI library is documented via [![Storybook](https://github.com/storybookjs/brand/blob/8d28584c89959d7075c237e9345955c895048977/badge/badge-storybook.svg)](http://storybook.operationcode.org)

Required versions of tools used within the repo:

- Node: See [.nvmrc](https://github.com/OperationCode/front-end/blob/main/.nvmrc)

- `yarn@1`

- `[email protected]` or greater

```sh

# Install dependencies

yarn

# Run local development

yarn dev

# Use Storybook as a workbench when developing new components

yarn storybook

# Run all unit tests

yarn test

# Run all Cypress tests (make sure your dev server is running)

yarn test:e2e

# Create all the necessary files/folders for a new, reusable component

yarn create-component $ComponentName

# Create the necessary file with a small boilerplate for a new page

yarn create-page $PageName

```

## Open Source Gratitude

We appreciate the following tools/companies that are providing us a service or platform for free or a heavily discounted rate.

Sorted alphabetically:

---

### Chromatic



Thanks to [Chromatic](https://www.chromatic.com/) for providing the visual testing platform that helps us review UI changes and catch visual regressions.

---

### LogRocket



Thanks to [LogRocket](https://logrocket.com/) for providing time-saving context on every error and insight into our user's behavior,

---

### Sentry



Thanks to [Sentry](https://getsentry.io) for a wonderful experience with cataloguing and managing errors.

---

### Vercel



Thanks to [Vercel](https://vercel.com) for hosting and continuous deployment of all our web applications.