https://github.com/anastasiiahombalevska/meme-generator

Meme generator with react
https://github.com/anastasiiahombalevska/meme-generator

javasc react scss

Last synced: 20 days ago
JSON representation

Meme generator with react

• Host: GitHub
• URL: https://github.com/anastasiiahombalevska/meme-generator
• Owner: AnastasiiaHombalevska
• Created: 2024-09-25T09:21:01.000Z (3 months ago)
• Default Branch: main
• Last Pushed: 2024-10-21T08:49:14.000Z (3 months ago)
• Last Synced: 2024-12-16T23:22:43.587Z (20 days ago)
• Topics: javasc, react, scss
• Language: JavaScript
• Homepage:
• Size: 17.7 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Meme Generator with React

This is a solution to the Meme Generator with React.

Solution: [DEMO LINK](https://anastasiiahombalevska.github.io/meme-generator/)

## Table of contents

- [Overview](#overview)

  - [The challenge](#the-challenge)

  - [Screenshot](#screenshot)

- [My process](#my-process)

  - [Built with](#built-with)

  - [What I learned](#what-i-learned)

## Overview

### The challenge

Users should be able to:

- get random meme image

- add top and bottom text to it

### Screenshot

![screenshot](/public/meme-generator.png)

## My process

### Built with

- react components

- SCSS custom properties

- CSS Flex Layout

- fetching data with useEffect hook

### What I learned

With this project the newest things I learnt are:

- How to fetch the data to react component using the useEffect hook

```react component

    useEffect(() => {

        fetch("https://api.imgflip.com/get_memes")

            .then(res => res.json())

            .then(data => setAllMemes(data.data.memes))

    }, []) 

```