Skip to content

Solutions to FreeCodeCamp's Front End Development Libraries projects, built with React, JavaScript, and CSS. Includes live previews of the Random Quote Machine, Markdown Previewer, Drum Machine, JavaScript Calculator, and 25 + 5 Clock. Explore and test the projects via CodePen links.

Notifications You must be signed in to change notification settings

Masniper/freecodecamp-frontend-libraries

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 

Repository files navigation

FreeCodeCamp Front End Development Libraries Projects

Welcome to my FreeCodeCamp Front End Development Libraries project showcase! This repository includes solutions to the following challenges, each built using React, JavaScript, and CSS. Explore live demos and source code for each project below.


Projects Overview

1. Random Quote Machine

A simple app that generates random quotes from famous personalities. Includes a feature to share quotes on Twitter with a single click.

Features:

  • Generate random quotes dynamically.
  • Share quotes on Twitter.
  • Responsive design for all devices.

Live Demo:

Random Quote Machine

2. Markdown Previewer

Convert Markdown to HTML in real time! This app is perfect for those learning Markdown or needing a quick preview tool.

Features:

  • Real-time Markdown-to-HTML conversion.
  • Simple and clean user interface.
  • Fully responsive design.

Live Demo:

Markdown Previewer

3. Drum Machine

A fun and interactive drum pad application where users can create beats using keyboard shortcuts.

Features:

  • Play sounds using mouse clicks or keyboard keys.
  • Visual feedback when buttons are pressed.
  • Responsive layout.

Live Demo:

Drum Machine

4. JavaScript Calculator

A fully functional calculator built using React. It performs basic arithmetic operations with a clean and intuitive interface.

Features:

  • Perform addition, subtraction, multiplication, and division.
  • Clear and responsive layout.

Live Demo:

JavaScript Calculator

5. 25 + 5 Clock

A customizable Pomodoro timer with work and break intervals. Perfect for boosting productivity!

Features:

  • Set custom work and break intervals.
  • Visual timer with dynamic updates.
  • Alarm sound when time is up.

Live Demo:

25 + 5 Clock

How to Use

  1. Click on any Live Demo link to explore the project in action on CodePen.
  2. Each demo is interactive and fully responsive.
  3. Feel free to fork the pens or adapt the code for your own use.

Feedback

I would love to hear your thoughts or suggestions! Feel free to open an issue or reach out to me on GitHub.


About

Solutions to FreeCodeCamp's Front End Development Libraries projects, built with React, JavaScript, and CSS. Includes live previews of the Random Quote Machine, Markdown Previewer, Drum Machine, JavaScript Calculator, and 25 + 5 Clock. Explore and test the projects via CodePen links.

Topics

Resources

Stars

Watchers

Forks

Packages

No packages published