Git Product home page Git Product logo

youdiary's Introduction

image

Docker Image CI

YouDiary is a simple, web-based markdown text editor that is intended for personal use. This was created for as a little experiment over Node's Filesystem API, bcrypt, sveltekit-adapter-node, marked.js and highlight.js.

๐Ÿ“ฆ Installation

You can grab a quick instance of YouDiary by following the steps below:

  1. Clone the project.
git clone https://github.com/ShindouMihou/YouDiary
  1. Head to the backend folder after entering the cloned project.
cd YouDiary && cd backend
  1. Rename the .env.example into .env.
mv .env.example .env
  1. Configure the .env file to your liking, preferably, just change the bucket name and keep the bucket path.
#----------
# YouDiary Configuration
#----------
BUCKET_NAME=DEFAULT
BUCKET_PATH=data
  1. Move back to the root directory.
cd ..
  1. Create the volume youdiary-volume which is separated for persistance-reasons.
docker volume create youdiary-volume
  1. Run docker-compose to build the containers and run them.
docker-compose up

Once docker-compose finishes building and running, you should be able to see something similar to this:

youdiary_client     | Listening on 0.0.0.0:3000
youdiary_backend    | 
youdiary_backend    | > [email protected] prod
youdiary_backend    | > node ./src/index.js
youdiary_backend    | 
youdiary_backend    | YouDiary, Bucketeer
youdiary_backend    | A simple web-based mark-down text editor.
youdiary_backend    | 
youdiary_backend    | Please do not share your bucket informatiaton unless you want others to access the data from the front-end.
youdiary_backend    | Port: 2312, Bucket: JDJiJDEwJEtZeXVlSnpLLkw2ZGtSeEhYVTg5M2UxZEFnL1BrNmdPd2hiUzNYdnBmSm05cm9QYUR3dmxp

You can now head to localhost:3000 where you will be greeted with two text fields:

  • Host: This should be localhost:2312 by default, unless you reconfigured the port or similar.
  • Bucket: The bucket is similar to a secret token that the hoster can see on the console, you should have already noticed it beside the port on the console report, copy the entire bucket text then paste it. In the example case, it would be JDJiJDEwJEtZeXVlSnpLLkw2ZGtSeEhYVTg5M2UxZEFnL1BrNmdPd2hiUzNYdnBmSm05cm9QYUR3dmxp.

You can now login and start creating a new page by pressing the + symbol where you can type the name of the page and start typing your markdown, although, the navigation bar will contain a few icons that might confuse you. Here are the definitions of each icons in the navigation bar on the editor:

  • To enter into markdown preview, you can press the โš—๏ธ icon.
  • To disable or enable autosave, you can press the ๐Ÿ“Š icon.
  • To save the page manually, you can press the ๐Ÿ“ icon.
  • To head back to the dashboard, you can press the ๐Ÿ  icon.

๐Ÿ“š Previews

Previews

Login Create Editor Preview Dashboard Delete by TailwindUi

๐Ÿฎ Credits

Thanks to the developers behind these technologies
  • Tailwind CSS (tailwindcss.com)
  • Sveltekit (kit.svelte.dev)
  • Markdown Test File (github.com/mxstbr/markdown-test-file)
  • Marked.js (marked.js.org)
  • Highlight.js (highlightjs.org)
  • HeroPatterns (heropatterns.com)
  • Heroicons (heroicons.com)
  • Docker (docker.com)
  • Node.js (nodejs.org)
  • Express.js (expressjs.com)
  • Bcrypt (npmjs.com/package/bcrypt)
  • And all the other dependencies that is working behind the scenes.

youdiary's People

Contributors

dependabot[bot] avatar shindoumihou avatar

Stargazers

 avatar  avatar  avatar

Watchers

 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.