This chrome extension makes Teachable.com more user-friendly for programmers. This extension allows you to toggle the course sidebar, so the video takes up more screen real estate without going full screen.

This chrome extension makes Teachable.com more user-friendly for programmers. 

JavaScript

Teachable Enhanced

This code is a React component that generates a form with an input field and a button. When the button is clicked, the code uses the value from the input field to determine how many paragraphs of text to display. The code uses React Hooks to store the value of the input field and the text that is generated. The handleSubmit function is used to prevent the form from submitting and to set the amount of text to be displayed. It also checks for errors if the user enters a number greater than 8, and sets the error state to true if an error is found.

This code is a React component that generates a form with an input field and a button.

React.js

HTML

React Lorem Generator

A medium.com clone with posts and comments. Built with Next.js, Typescript, and Tailwind CSS.

TypeScript

Sanity

Next.js

Tailwind CSS

Medium Clone

A responsive email made with HTML, and CSS.

A responsive email made with html, and css

Responsive Watch Email

This code creates a React application that displays a menu of items. The App.js file imports the Menu and Categories components, as well as an array of menu item data from the data.js file. The allCategories array is created from the menu item data and is used to generate the filter buttons in the Categories component. The filterItems function is used to filter the menu items based on the category that is chosen. The Menu component then displays the filtered or all menu items.

A simple React application that displays a menu for a restaurant. The user can filter the menu items by category using the buttons at the top of the page.

Restaurant Menu

This code uses React hooks to create a carousel of reviews.
The useState hook is used to store the array of people data and the index of the active slide. The useEffect hook is then used to check the index and make sure it is within the bounds of the array. It also sets an interval that triggers the setIndex function every 3 seconds, advancing the index and thus the carousel. The render function then maps through the people data, assigning a class to each slide depending on its index. Finally, the code includes two buttons that trigger the setIndex function to go back or forward in the carousel.

This code uses React hooks to create a carousel of reviews.

All Projects

Teachable Enhanced

React Lorem Generator

Medium Clone

Responsive Watch Email

Restaurant Menu

React Testimonial Slider