https://github.com/ryzmdn/freecodecamp-front-end
5 freeCodeCamp Front-end certification projects.
https://github.com/ryzmdn/freecodecamp-front-end
certification freecodecamp-project front-end
Last synced: 12 months ago
JSON representation
5 freeCodeCamp Front-end certification projects.
- Host: GitHub
- URL: https://github.com/ryzmdn/freecodecamp-front-end
- Owner: ryzmdn
- Created: 2024-12-14T03:56:54.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-12-14T04:02:28.000Z (over 1 year ago)
- Last Synced: 2025-07-03T02:05:41.434Z (12 months ago)
- Topics: certification, freecodecamp-project, front-end
- Language: JavaScript
- Homepage:
- Size: 16.6 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# FreeCodeCamp Front-end Projects
I'm very happy to have completed all the certified Front End Development Libraries Projects from the [freeCodeCamp curriculum](https://www.freecodecamp.org/learn/front-end-development-libraries), which use a combination of **HTML**, **JavaScript**, **CSS**, **Bootstrap**, **SASS**, **React**, **Redux**, and **jQuery**. In this repository, I will share examples of the syntax for the **5 projects** I've completed. You can also use them to solve any issues you encounter while working on your own projects.
## Projects in this Repository
1. **Quote Machine**: A random quote generator that fetches a new quote and author each time the user clicks a button. It also includes a feature to share quotes on Twitter. [demo](https://codepen.io/ryzmdn/pen/gbYrvxx)
2. **Markdown Previewer**: A markdown editor and previewer that updates the rendered output in real time as the user types. It supports GitHub-flavored Markdown syntax. [demo](https://codepen.io/ryzmdn/pen/raBLNYL)
3. **Drum Machine**: A virtual drum pad interface where users can click buttons or use keyboard shortcuts to play sounds. The displayed text updates dynamically based on the sound played. [demo](https://codepen.io/ryzmdn/pen/KwPgvBN)
4. **JavaScript Calculator**: A fully functional calculator that supports basic operations like addition, subtraction, multiplication, and division. It also handles operator precedence and edge cases. [demo](https://codepen.io/ryzmdn/pen/zxOKQeb)
5. **25 + 5 Clock**: A Pomodoro-style timer where users can set a 25-minute work session and a 5-minute break. It features a countdown timer, audio notification, and customizable session/break durations. [demo](https://codepen.io/ryzmdn/pen/XJrNamK)
## Features
- Fully responsive designs.
- Code structured to follow best practices.
- Comprehensive examples to help debug or understand the projects.
- Modular components for easy reuse.
## How to Clone the Repository
Follow these steps to clone and run the projects locally:
```bash
# Clone the repository
git clone https://github.com/ryzmdn/freecodecamp-front-end.git
# Change directory
cd freecodecamp-front-end
# Open default code editor
code .
```
## Project Structure
The repository is organized as follows:
```bash
freecodecamp-front-end/
|
├── 25+5-clock/
├── drum-machine/
├── javascript-calculator/
├── markdown-previewer/
├── random-quote-machine/
└── README.md
```
Each folder contains the source code for the respective project.
## Contributions
If you find any issues or have suggestions for improvement, feel free to open an issue or submit a pull request. Contributions are always welcome!
## License
No License.
---
Thank you for visiting this repository! Happy coding!