GithubHelp home page GithubHelp logo

royriojas / takenote Goto Github PK

View Code? Open in Web Editor NEW

This project forked from taniarascia/takenote

0.0 2.0 0.0 8.15 MB

πŸ“ β€Ž A free, open-source notes app for the web.

Home Page: https://takenote.dev

License: MIT License

HTML 0.17% TypeScript 77.79% Dockerfile 0.22% JavaScript 4.34% Shell 0.63% SCSS 16.85%

takenote's Introduction

A free, open-source notes app for the web. (WIP)

Warning: TakeNote is in active development. You can visit takenote.dev to see the work in progress, but your account and the notes you create are temporary will not be persisted. All data will be lost once GitHub integration is complete.

Screenshot

Fast and simple

TakeNote was made by developers for developers - a simple, plain-text note-taking app for the web with Markdown support. What you see is what you paste. No WYSIWIG, no formatting pasted from the web, and no features you don't need or want.

Intuitive

Drag-and-drop notes into categories, instantly search through notes, and pin your favorites to the top.

Beautiful

Enjoy a beautiful, clean design reminiscent of your IDE with light and dark themes.

Sync to GitHub

In progress!

Reviews

"I think the lack of extra crap is a feature." β€” Craig Lam

Setup

Pre-Installation

Before working on TakeNote locally, you must create a GitHub OAuth app for development.

Go to your GitHub profile settings, and click on Developer Settings.

Click the New OAuth App button.

  • Application name: TakeNote Development
  • Homepage URL: http://localhost:3000
  • Authorization callback URL: http://localhost:3000/api/auth/callback

Create a .env file in the root of the project, and add the app's client ID and secret.

CLIENT_ID=xxx
CLIENT_SECRET=xxxx

Change the URLs to port 5000 in production mode or Docker.

Installation

git clone [email protected]:taniarascia/takenote
cd takenote
npm i

Development mode

In the development environment, an Express server is running on port 5000 to handle all API calls, and a hot Webpack dev server is running on port 3000 for the React frontend. To run both of these servers concurrently, run the dev command.

npm run dev

Go to localhost:3000 to view the app.

API requests will be proxied to port 5000 automatically.

Production mode

In the production environment, the React app is built, and Express redirects all incoming requests to the dist directory on port 5000.

npm run build && npm run start

Go to localhost:5000 to view the app.

Run in Docker

Follow these instructions to build an image and run a container.

# Build Docker image
docker build --build-arg CLIENT_ID=xxx -t takenote:mytag .

# Run Docker container in port 5000
docker run \
-e CLIENT_ID=xxx \
-e CLIENT_SECRET=xxxx \
-e NODE_ENV=development \
-p 5000:5000 \
takenote:mytag

Go to localhost:5000 to view the app.

Note: You will see some errors during the installation phase, but these are simply warnings that unnecessary packages do not exist, since the Node Alpine base image is minimal.

Seed data

To seed the app with some test data, paste the contents of seed.js into your browser console.

Testing

Run unit and component/integration tests.

npm run test

If using Jest Runner in VSCode, add "jestrunner.configPath": "config/jest.config.js" to your settings

Run Cypress end-to-end tests.

# In one window, run the application in test mode
npm run dev:test

# In another window, run the end-to-end tests
npm run test:e2e:open

Contributing

TakeNote is an open source project, and contributions of any kind are welcome and appreciated. Open issues, bugs, and feature requests are all listed on the issues tab and labeled accordingly. Feel free to open bug tickets and make feature requests. Easy bugs and features will be tagged with the good first issue label.

View CONTRIBUTING.md to learn about the style guide, folder structure, scripts, and how to contribute.

Contributors

Thanks goes to these wonderful people:


Tania Rascia

πŸ’» πŸ€” πŸ›

hankolsen

πŸ’» πŸ› ⚠️

Joseph Perez

πŸ’»

Paul

πŸ’» ⚠️

Martin Rosenberg

πŸ’» πŸ› 🚧

Melissa

πŸ’»

Jason Towle

πŸ’»

Mark Erikson

πŸ€”

Alphonse Bouy

πŸ›

dave2kb

🎨 πŸ€”

Devin McIntyre

πŸ’»

Jeffrey Fisher

πŸ›

Alex Dong

πŸ’»

Publicker

πŸ’»

Jakub NaskrΔ™ski

πŸ’» πŸ› ⚠️

Benny O

πŸ’»

Justin Payne

πŸ’»

marshmallow

🚧

Jose Felix

πŸ’»

Nikolay Kirsh

πŸ’»

Mudassar Ali

πŸ’»

Nathan Bland

πŸ› πŸ’»

Craig Lam

πŸ’» πŸ› ⚠️

Ashinze Ekene

πŸ› πŸ’»

Harry Sullivan

πŸ’»

Mauricio MartΓ­nez

πŸ’»

Black-Hole

πŸ’»

Frank Blendinger

πŸ’»

Eduardo Reveles

πŸ’»

Leo Royzengurt

πŸ’» πŸ›

kcvgan

πŸ’» πŸ›

Cody Towstik

πŸ’» ⚠️ πŸ›

Vincent DΓΆrig

⚠️ πŸ’»

Michael Huynh

πŸ’» πŸ›

Joshua Bloom

πŸ’»

Mxchaeltrxn

πŸ’» ⚠️

Konrad Staniszewski

πŸ“–

Yohix

🚧

Jackson Elfers

πŸ’»

Vamshi

πŸ’»

Simos

πŸ’» ⚠️

Yankee

πŸ’» πŸ€” ⚠️

G-Milevski

πŸ’»

Kody Clemens

πŸ’» ⚠️ πŸ›

Acknowledgements

Author

License

This project is open source and available under the MIT License.

takenote's People

Contributors

taniarascia avatar allcontributors[bot] avatar martinrosenberg avatar codytowstik avatar joserfelix avatar hankolsen avatar dong-alex avatar joseph-perez avatar siliconeidolon avatar dantaro avatar pavlakissimos avatar ashinzekene avatar jakenvac avatar kcvgan avatar vincentdoerig avatar mudssrali avatar miqh avatar konradstanski avatar kodyclemens avatar justdoindev avatar jeffslofish avatar jaknas avatar jakapatb avatar jackson-elfers avatar harrysullivan235345 avatar g-milevski avatar yogan avatar arslandogar avatar ggonza89 avatar vamshi-tg avatar

Watchers

James Cloos avatar  avatar

Recommend Projects

  • React photo React

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

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

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

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo 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.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

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

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.