coffeeclass.io β
Learn programming and computer science for free.
Project Overview
This website is a platform to learn to code. It is inspired by sites like freeCodeCamp, CSS Tricks, Fireship.io, Smashing Magazine, and many others. Coffeeclass.io is open source and we encourage contributions to both the website and the content! Read on to learn more about the project.
Quick Start
- Clone this repo:
git clone https://github.com/carlson-technologies/coffeeclass.io.git
- Move into root (where this file is) and run
yarn
- (Optional) Create a
.env
file and copy into it the content of.env.example
. - Run
yarn dev
to start the server - Navigate to http://localhost:3000
If you are creating a PR, create a new branch. Before you commit run yarn build
. This will run the tests and make sure everything is working.
Note: If you are not planning on making a PR, you can run rm -rf .git
to remove git tracking.
Tech Stack Overview
- π Next.js - Framework
- π¨ Chakra UI - CSS Component Library
- π TypeScript (and some JavaScript) - Web language of choice
- π§ͺ Jest - Testing
- βπΌ MDX - Database for Article, Authors, Courses, Tags
- πΊ Vercel - Deployment
- π» GitHub - Version Control
- π Google Analytics - Analytics
- π Splitbee - More Analytics
- π Algolia - Search
Besides the above, this site uses additional yarn packages and some other smaller external software.
Deep(er-ish) Dive
This repo is broken up into 4 main parts.
src
: This is the Next.js website.content
: This is the content for the website stored inmdx
files.public
: This is the static assets for the website.tests
: Jest unit tests for the website.
Inside the src
folder, we have the following:
components
: Our UI components.configs
: Various configuration files for courses.hooks
: Custom TS hooks.layouts
: MDX page layouts.pages
: Where the pages (routes) and api routes are stored.scripts
: Stand alone scripts (DRY) and build scriptsstyles
: Theme styles and Chakra UI default theme config.
Open Source
This entire project is open source. We encourage contributions! Read on to see how you can contribute.
Contributing Content
If you want to contribute an article please follow the steps on https://benjamincarlson.notion.site/Contributing-to-Coffeeclass-io-27ab5e894368424a9c86a7f11555514b. Below is a quick guide to submit an article or start a new course.
Article
Course
Here are the steps to add a new course:
- Add course to
courses.json
- Add json file in
configs/courses
folder - Import json and add it to
configMap
inpages/courses/[course]/index.tsx
,Components/Courses/Sidebar
, andComponents/Courses/Pagination
- Add folder to
content/courses
with at least one module
Contributing to the Website
You can also contribute to the website itself. New features and bug fixes are always appreciated. Feel free to check out the Roadmap π for future plans and what we're working on currently. If you see anything you want to tackle, feel free to leave a comment on the Roadmap user story and open a PR!
Roadmap π
Our roadmap is also our agile development process. View cards, see what we are working on, view future plans and more on the roadmap.
Thanks
The following companies and services have given free services to this website. Go check them out!