Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Update README.md #1097

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Update README.md #1097

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
187 changes: 109 additions & 78 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,22 +1,7 @@
# Doc2Pen
<div align="center">
<img src="readme_assets/doc2pen.gif">

<p align="center"><img src="readme_assets/doc2pen.gif"></p>

Are you a student who is tired of having to write out assignments on paper, draw sketches by hand, scan each page, convert it all to a PDF, and finally submit? 😩

Does it seem too much of a hassle in this age of online education? 😫

If your answer is yes, then you've come to the right place! 😃

### Doc2Pen is the 1 stop shop for getting all your "handmade" assignments ready for submission digitally. 🥳

- Use the highly customisable Editor page to type in text and get a handwritten document! 📝
- Use the Sketch page to digitally draw in a handmade style! 🎨
- And in the end, use the Media Manip page to convert your assignment into the appropriate format for submission! 📚

It really is that easy! 🎊

And the best part of all? **Doc2Pen is open source!** 🤩
<h1>Doc2Pen</h1>

![Issues](https://img.shields.io/github/issues/smaranjitghose/doc2pen)
![Pull Requests](https://img.shields.io/github/issues-pr/smaranjitghose/doc2pen)
Expand All @@ -25,6 +10,15 @@ And the best part of all? **Doc2Pen is open source!** 🤩
[![License](https://img.shields.io/github/license/smaranjitghose/doc2pen)](https://github.com/smaranjitghose/doc2pen/blob/master/LICENSE)
![](https://img.shields.io/github/repo-size/smaranjitghose/doc2pen.svg?label=Repo%20size&style=flat-square)&nbsp;

<p>
Are you a student who is tired of having to write out assignments on paper, draw sketches by hand, scan each page, convert it all to a PDF, and finally submit? 😩

Does it seem too much of a hassle in this age of online education? 😫

If your answer is yes, then you've come to the right place! 😃
</p>
</div>

## DEMO

### Home Page
Expand All @@ -43,7 +37,36 @@ And the best part of all? **Doc2Pen is open source!** 🤩

<img src="readme_assets/mediaManip.gif">

## Features:

## How it Works

<p> Doc2Pen is the one stop-shop for getting all your "handmade" assignments ready for submission digitally.
</p>

- Use the highly customisable Editor page to type in text and get a handwritten document! 📝
- Use the Sketch page to digitally draw in a handmade style! 🎨
- And in the end, use the Media Manip page to convert your assignment into the appropriate format for submission! 📚

> It really is that easy! 🎊. And the best part of all? **Doc2Pen is open source!** 🤩

## Tech Stack 💻

<img alt="React" src="https://img.shields.io/badge/react%20-%2320232a.svg?&style=for-the-badge&logo=react&logoColor=%2361DAFB"/> <img alt="HTML5" src="https://img.shields.io/badge/html5%20-%23E34F26.svg?&style=for-the-badge&logo=html5&logoColor=white"/> <img alt="React" src="https://img.shields.io/badge/Sass-CC6699?style=for-the-badge&logo=sass&logoColor=white">

### Other Technologies

- [React - Bootstrap](https://react-bootstrap.github.io/)
- [React - Helmet](https://www.npmjs.com/package/react-helmet): Document Head Management
- [React - Leaflet.js](https://react-leaflet.js.org/): Interactive Maps
- [React - Dropzone.js](https://react-dropzone.js.org/): Drag and drop file uploads
- [Rough.js](https://roughjs.com/): Make sketchy, hand drawn figures
- [Mousetrap](https://github.com/ccampbell/mousetrap): Handling Keyboard shortcuts
- [ReactJS - Snackbar](https://www.npmjs.com/package/react-js-snackbar): Making snackbars to provide brief messages
- [React Reveal](https://www.react-reveal.com/): Animations
- [JSPDF](https://www.npmjs.com/package/jspdf): Generate PDFs
- [React Scroll](https://www.npmjs.com/package/react-scroll): Smooth Scrolling between sections

## Features

- [ ] Type/Paste your assignments and get handwritten ones to download directly! Bye-Bye Pen&Paper
- [ ] Make Sketches/Diagrams/Figures for your assignments/presentations
Expand All @@ -60,89 +83,97 @@ And the best part of all? **Doc2Pen is open source!** 🤩
- [ ] JIFF to JPG
- [ ] PNG(multiple) to PDF

## Basic structure of the project repository 🗃️📂

```terminal
|
|- readme_assets # Contains all the images used for the README.MD
|- public # Contains the stylesheets, images and fonts. Any files within this directory will not be processed by Webpack but copied directly to the build folder.
|- src: # Contains all source code for the React application.
|
|- App.js
|- index.css
|- index.js
|-assets # Contains all the community brand assets
|-components # Contains all the components used within the app.
|-fonts # Contains all the fonts
|-pages # Contains all the sections of the page.
|- 404
|- Home
|- Editor
|- Sketch
|-seo # Contains code for meta tags using react-helmet
```
## Project Structure 📂

### Tech Stack: 💻

<img alt="React" src="https://img.shields.io/badge/react%20-%2320232a.svg?&style=for-the-badge&logo=react&logoColor=%2361DAFB"/> <img alt="HTML5" src="https://img.shields.io/badge/html5%20-%23E34F26.svg?&style=for-the-badge&logo=html5&logoColor=white"/> <img alt="React" src="https://img.shields.io/badge/Sass-CC6699?style=for-the-badge&logo=sass&logoColor=white">
```
root
├── .github
├── public
├── readme_assets
├── src
│ ├── assets
│ ├── components
│ ├── fonts
│ ├── Pages
│ ├── scss
│ ├── seo
│ ├── App.js
│ ├── App.test.js
│ ├── index.js
│ ├── index.scss
│ ├── reportWebVitals.js
│ └── setupTests.js
│
├── .eslintrc.js
├── .gitignore
├── .prettierignore
├── .prettierrc.js
├── CODE_OF_CONDUCT.md
├── CONTRIBUTING.md
├── docker-compose.yml
├── Dockerfile
├── LINCENSE
├── package-lock.json
├── package.json
├── WEB_OPTIMIZATION.md
└── yarn.lock
```

## Under the hood:
- `readme_assets` - contains all the images used in the **README.MD**
- `public` - contains the stylesheets, images and fonts. Any files within this directory will not be processed by Webpack but copied directly to the build folder.
- `src` - contains all source code for the React application.
- `assets` - contains all the community brand assets
- `components` - contains all the components used within the app.
- `fonts` - contains all the fonts
- `pages` - contains all the sections of the page.
- `seo` - contains code for meta tags using react-helmet

- [React - Bootstrap](https://react-bootstrap.github.io/)
- [React - Helmet](https://www.npmjs.com/package/react-helmet): Document Head Management
- [React - Leaflet.js](https://react-leaflet.js.org/): Interactive Maps
- [React - Dropzone.js](https://react-dropzone.js.org/): Drag and drop file uploads
- [Rough.js](https://roughjs.com/): Make sketchy, hand drawn figures
- [Mousetrap](https://github.com/ccampbell/mousetrap): Handling Keyboard shortcuts
- [ReactJS - Snackbar](https://www.npmjs.com/package/react-js-snackbar): Making snackbars to provide brief messages
- [React Reveal](https://www.react-reveal.com/): Animations
- [JSPDF](https://www.npmjs.com/package/jspdf): Generate PDFs
- [React Scroll](https://www.npmjs.com/package/react-scroll): Smooth Scrolling between sections
## Code of Conduct

## Wish to fix a bug or add a new feature?[![contributions welcome](https://img.shields.io/badge/contributions-welcome-brightgreen.svg?style=flat)](https://github.com/dwyl/esta/issues)🤝🏽🍀:
Check out our [Code of Conduct](./CODE_OF_CONDUCT.md) before making contributions.

<p align = "center"><img src = "https://media.giphy.com/media/1xOe0qgiYLYWE6pkki/giphy.gif"></p>
## Want to fix a bug or add a new feature?

Please check out our [contribution guidelines](./CONTRIBUTING.md)
Contributions of all kinds are welcomed.
Please check out our [Contribution Guidelines](./CONTRIBUTING.md).

## The geeks🤓 behind this initiative:
## The geeks🤓 behind this initiative

**Our Project Maintainers👨‍🏫:**

<p align="center">
<img width=20% src="https://avatars2.githubusercontent.com/u/46641503?v=4">&ensp;&ensp;&ensp;
<img width=20% src="https://avatars2.githubusercontent.com/u/40017559?v=4">
</p>

<a href="https://github.com/smaranjitghose">
<h5 align="center"><b>Smaranjit Ghose</b></a>&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;
<a href="https://github.com/anushbhatia"><b>Anush Bhatia</b></h5></a>
<table>
<tbody>
<tr>
<td align="center"><a href="https://github.com/DevrajDC"><img width=50% src="https://avatars2.githubusercontent.com/u/46641503?v=4" /><br><sub><b> Smaranjit Ghose</b></sub></a><br></td> </a></td>

<td align="center"><a href="https://github.com/nimishjn"><img width=50% src="https://avatars2.githubusercontent.com/u/40017559?v=4" /><br><sub><b>Anush Bhatia</b></sub></a><br></td> </a></td>
</tr>
</tbody>
</table>

**Our valuable Contributors👩‍💻👨‍💻**
<a href="https://github.com/smaranjitghose/doc2pen/graphs/contributors">
<img src="https://contributors-img.web.app/image?repo=smaranjitghose/doc2pen" />
</a>

## Open Source Programs we have been associated with:
## Open Source Programs we have been associated with

<p align="center">
<a href="https://www.pclubsummerofcode.in/"><img src="./readme_assets/psoc.png" width="25%"></a>
<a href="https://hakincodes.tech/"><img src="./readme_assets/ch.png" width="25%"></a>
<a href="https://devscript.tech/woc/"><img src="./readme_assets/dwoc.png" width="25%"></a>
<a href="https://www.pclubsummerofcode.in/"><img src="./readme_assets/psoc.png" width="40px"></a>
<a href="https://hakincodes.tech/"><img src="./readme_assets/ch.png" width="40px"></a>
<a href="https://devscript.tech/woc/"><img src="./readme_assets/dwoc.png" width="40px"></a>
</a>
<a href="https://slop.dscdaiict.in/projects"><img src="./readme_assets/SLOP.webp" width= "25%"/></a>
<a href="https://swoc.tech/"><img src="./readme_assets/SWOC-logo.webp" width= "25%" height= ""/></a>
<a href="https://crosswoc.ieeedtu.in/"><img src="./readme_assets/crosswoc.png" width= "25%"/></a>
<a href="https://mexili.github.io/winter_of_code/"><img src="./readme_assets/mwoc.png" width= "25%"/></a>
<a href="https://gssoc.girlscript.tech/"><img src="./readme_assets/gssoc.png" width= "25%"/></a>
<a href="https://slop.dscdaiict.in/projects"><img src="./readme_assets/SLOP.webp" width= "40px"/></a>
<a href="https://swoc.tech/"><img src="./readme_assets/SWOC-logo.webp" width= "40px" height= ""/></a>
<a href="https://crosswoc.ieeedtu.in/"><img src="./readme_assets/crosswoc.png" width= "40px"/></a>
<a href="https://mexili.github.io/winter_of_code/"><img src="./readme_assets/mwoc.png" width= "40px"/></a>
<a href="https://gssoc.girlscript.tech/"><img src="./readme_assets/gssoc.png" width= "40px"/></a>
</p>

## Code of Conduct

<p align="center"><img src="https://media.giphy.com/media/qHRwTyhWIj4UU/200w_d.gif" width=35%></p>

## License

<p align="center"><img src="https://media.giphy.com/media/xUPGcJGy8I928yIlAQ/giphy.gif" width=35%></p>
This work is licensed under Creative Commons Legal Code.

## Made with ♥ for the students of the world!