Light

contrihub / meme-generator Goto Github PK

View Code? Open in Web Editor NEW

0.0 2.0 21.0 1.68 MB

a simple meme generator using ReactJs

CSS 18.05% HTML 2.01% JavaScript 79.94%

hacktoberfest contrihub mnnit

meme-generator's Introduction

Meme Generator 😆

A meme generator using react

meme images are taken from: https://api.imgflip.com/get_memes

How to run locally

open the terminal/command prompt at the location where you want to setup the project.

use the following commands in the terminal or command prompt:

git clone https://github.com/ContriHUB/Meme-Generator.git

cd Meme-Generator

npm i

once these command are completed successfully

do npm start to start the project

Contributing

Fork this repo and clone it to your system.
Get the issue assigned to you on the ContriHUB website.
Make the required changes. Please keep your changes relevant only to the issue specified.
Add your name in the CONTRIBUTORS.MD file
Create a PR with your changes and a detailed description of the changes you have made.
Submit the PR link on the ContriHUB website.

Read the CONTRIBUTING guide. For major changes, please open an issue first to discuss what you would like to change.

NOTE:

No external library is allowed for this project.

Contributors

A list of contributors can be found in CONTRIBUTORS.MD

meme-generator's People

Watchers

meme-generator's Issues

add a reset button

this button should clear all the text and the image

add button to download/save the meme

This issue is currently assigned to @codechampriyanshu

ability to change width and orientation of the text

input text not showing on the page

the input in the input fields is not showing on the page, make changes to show the text

add feature to use local images as meme

this feature allows the user to use an image from their pc/laptop as the meme. In simple words user should be able to upload an image and use it as meme

make meme image responsive

use some css to make the image responsive

make input form responsive

facility to add more text and also delete them

currently, the user can only provide two text inputs. Implement the feature to add more text and also add a delete button on every text

text should be placed on the image

currently, the text is below the image. Make changes such that the text is shown on the image

feature:add support to drag text on mobile devices

dragging is implemented for desktop/pc device which uses the mouse. But it's not working on mobile/touch devices.

handle api call failure

make changes accordingly to handle API call fail and add a check on the generate meme button

change position of the text

user should be able to drag the text on the image to place it wherever they want

Recommend Projects

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.
Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
TensorFlow

An Open Source Machine Learning Framework for Everyone
Django

The Web framework for perfectionists with deadlines.
Laravel

A PHP framework for web artisans
D3

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
web

Some thing interesting about web. New door for the world.
server

A server is a program made to process requests and deliver data to clients.
Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Visualization

Some thing interesting about visualization, use data art
Game

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft

Open source projects and samples from Microsoft.
Google

Google ❤️ Open Source for everyone.
Alibaba

Alibaba Open Source for everyone
D3

Data-Driven Documents codes.
Tencent

China tencent open source team.