Giter Site home page Giter Site logo

rgerum / unofficial-duolingo-stories Goto Github PK

View Code? Open in Web Editor NEW
125.0 11.0 28.0 11.08 MB

This project brings the official Duolingo Stories to new languages, translated by a community effort.

Home Page: https://duostories.org

JavaScript 78.84% Python 2.26% CSS 13.97% Shell 0.03% TypeScript 1.81% MDX 3.09%
language-learning web react community nextjs cypress postgresql

unofficial-duolingo-stories's Introduction

Unofficial Duolingo Stories

Cypress Test chat

This project brings the official Duolingo Stories to new languages, translated by a community effort.

It is not an official product of Duolingo, nor is there any plan to integrate it into their platform or app.

It is hosted at https://duostories.org and reproduces the story experience from the official Duolingo stories.

The app is based on Next.js with React. It is currently in next/next-all.

How to run locally

First you need to set up a PostgreSQL server.

If you are on Linux you can use the following commands to install Postgres:

Ubuntu:

sudo apt install postgresql

Fedora:

# Install and initialize PostgreSQL
sudo dnf install postgresql-server postgresql-contrib
sudo postgresql-setup --initdb --unit postgresql

# If you get ident errors when running the psql lines below, try switching to md5
# And don't forget to restart the service!
sudo sed -i -e 's/ident/md5/g' /var/lib/pgsql/data/pg_hba.conf

# To start postgresql server by default when booting up
sudo systemctl enable postgresql

To set it up:

sudo systemctl restart postgresql.service
sudo -u postgres psql -c "ALTER USER postgres with encrypted password 'postgres';"
export PGPASSWORD=postgres

Then you need to initialize the database

sudo -u postgres psql -c "CREATE DATABASE duostories_test_db;"
psql -U postgres -h localhost -d duostories_test_db -f database/schema.sql
psql -U postgres -h localhost -d duostories_test_db -c \\dt

Now you need to create a file called .env.local in the base folder of the project and add the following environment variable containing the URL for the Postgres database:

POSTGRES_URL=postgresql://postgres:postgres@localhost:5432/duostories_test_db

Install the npm packages

npm install

Create fill the database with test data

npm run init

To develop you can then run and visit http://localhost:3000

npm run dev

The test database contains three uses to test the login process:

Username Password Usage
user test To test a normal user login
editor test To test login to the editor
admin test To test login to the admin interface

How to contribute

To contribute to the project you should open an issue to discuss your proposed change. You can assign the issue to yourself to show that you want to work on that. If there is a consensus that this bug should be fixed or this feature should be implemented, then follow the following steps:

  • create a fork of the repository
  • clone it to your computer
  • create a branch for your feature
  • make the changes to the code
  • commit and push the changes to GitHub
  • create a pull request

Please make sure to only commit changes to files that are necessary to the issue. Try to not commit accidentally other changes, e.g. package-lock.json files. This makes it harder to review and merge the pull request.

If everything is fine, I will accept the pull request and I will soon upload it to the website.

unofficial-duolingo-stories's People

Contributors

albrumn avatar chickendude avatar danika-dakika avatar dependabot[bot] avatar gootube2000 avatar ifrzzl avatar jahtomini avatar kyudeathsbr avatar onfranciis avatar paolodibello avatar rgerum avatar ronran1 avatar rupledzo3072 avatar squarescreamyt avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

unofficial-duolingo-stories's Issues

QC pipeline

Users should have the possibility to click "endorse" for a story if they checked if and if enough people checked it it can go public (maybe by an admin).

Bug: Going directly to the editor URL for a story doesn't show login screen if you're not logged in

Steps to reproduce:

  1. Bookmark a URL while editing a story (e.g. https://editor.duostories.org/?story=1656)
  2. Clear cookies (some people have this set as the default behavior upon browser close)
  3. Click the bookmarked URL for editing a story to navigate to that URL. The page is blank instead of showing a login screen:
    Screen Shot 2022-04-29 at 7 33 42 PM

Expected behavior: if the user is not logged in and navigates directly to a URL for editing a story (e.g. by bookmark), they should be shown the login screen.

How to run stories-app locally

cd stories-app
npm install
npm start

Then I get a load of CSS issues in the browser

Are there some bits which are missing ? What do I need to do to get stories-app working locally ? Is there a README for it ?

Many thanks

In the editor, add export options for stories

Exporting to a Google Doc seems like the most collaborative solution. Exporting to PDF may be another option to share the story but it likely would be more difficult to collaborate on a PDF.

Audio via MP3 upload

Provide an interface to upload custom audio files. We also would need the interface to feature an interface to position the speech marks (which word is spoken when).

Statistics Display

It might be good to have a statistics display of stories completed per week and language to find out which languages might need more advertisement.

Use a modern URL structure

This is likely low priority, but would establish a good base for building future functionality off it.

Most modern web app URLs are structured so that the resource has a direct path to it. E.g.

Google Docs: https://docs.google.com/document/d/<documentID>
Discord: https://discord.com/channels/<channelID>
Duolingo: https://www.duolingo.com/skill/<language>/<skillName>

And resources have actions after that path:

Google Docs: https://docs.google.com/document/d/<documentID>/edit
Facebook: https://www.facebook.com/marketplace/create/

Currently Duostories.org uses a parameter to specify the story: https://editor.duostories.org/?story=<storyID>

Instead, something like
https://editor.duostories.org/story/<storyID>
or
https://editor.duostories.org/course/<courseID>
would allow for further expansion of functionality.
E.g.
to edit a story: https://editor.duostories.org/story/<storyID>/edit
to preview a story: https://editor.duostories.org/story/<storyID>/preview

Roadmap?

Just wondering if you might produce a roadmap for this project. I can see is being worked on recently, but before that not for a few months. Am guessing you are busy with other stuff. But I notice lots of people on the Duolingo forum really like it, so congrats. Do you want or need developers to help keep this project fresh ? Rgds

CONTINUATION questions without audio

The [CONTINUATION] questions should first use the audio with the hidden part silenced. Then after completion only play the new part and then if you click the loudspeaker play the whole sentence.

Database of Doulingo stories

Your application is great. I also want to make a similar website of yours to practice but have data problem. Can I contact you to talk about the database problem? Thanks !

Hey are you up to have a conversation about the project?

May I say that I love the project!!
I've used it a bunch now and really love it, especially when I saw the announcement of the Japanese stories, but also when I stumped upon the project I see a lot of stuff that could be improved and I'd love to help with it!!

Example of stuff I'd do differently.
CMS for stories management. We could implement a cms in the backend where we could allow editors (community members) to edit and manage stories in an easier way. (I've used this before and is super good and think could meet the needs Sanity)
FE could be developed with React for example. (Same framework used by duo themselves) This would help with the development of the features and makes it easier to work with js code.

Obviously this is just my point of view and would respect you decisions anyway.

P.S.
Could you leave more details on the README on how to run the project? Just so I can see at what else could be improved

Audio with pitch specification

The speech synthesis provides options for speed and pitch. It would be good to allow voices to be altered a bit, especially for languages with only a few voices available.

Bug: scrolling in the editor takes a few tries

Steps to reproduce:

  1. Open the story editor.
  2. Scroll to the bottom of the page.

Bug: the bottom of the page doesn't show.

Reproducibility: 100%

Workaround: scroll a few more times to get to the bottom

Screen.Recording.2022-04-28.at.11.17.17.PM.mov

Enhancement: Support <Enter> to login

This is probably very low priority but also a quick one.

A common flow for signing into a website is:

  1. Type username
  2. Hit to move to the password field
  3. Type password
  4. Hit to log in

When I hit Enter in the password field on duostories.org, nothing happens. I have to click Log In.

Again, not a big deal. But most sites support this.

Deleting story

Contributors should be able to delete stories. Maybe with a possibility for admins to restore them in case they are accidentally deleted.

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.