/linguana

A language-learning web app inspired by Duolingo.

Primary LanguageJavaScript

Linguana

Live site

Image of Linguana Skills Page

Image of Linguana Lesson

Summary

Linguana is a gamified full-stack language-learning app that draws inspiration from Duolingo and was built from scratch using an array of technologies that includes Ruby on Rails, React.js and PostgreSQL.

Features

Cookie Store

A Flux-enabled cookie store sets and gets information from cookies in localStorage. Thanks to this, users are able to enjoy much of the same functionality when logged out as they can when logged in. If a logged-out user completes an entire course, she can save her progress to the database by simply logging in or creating an account. The cookie store sets browser cookies for everything from the current course to an array of completions, and AJAX requests are sent out on login to persist any relevant information from the cookies. All of the cookie information is made secure using the Stanford Javascript Crypto Library.

Completables

A polymorphic completables association is used to keep track of users' completions of courses, skills and lessons. This helps keep the code DRY and readily extensible.

Authentification

BCrypt is used to encrypt users' passwords, which are then securely stored in a password_digest column in the users table.

OAuth

OmniAuth integration offers convenient login and signup using Facebook and Google. When a user signs up through either service, their relevant info is pulled and a new user is created in the database.

Paperclip and Amazon Web Services

URLs and important data about images such as users' profile pictures are stored in the database with aid from paperclip. The images themselves are stored remotely using Amazon S3.

Languages and Technologies

  • Ruby on Rails
  • React.js
  • Flux architecture
  • PostgreSQL
  • HTML/CSS

Some Important Gems

Some Important Node Packages

Other Libraries, etc.

Acknowledgements

My extremely talented sister created the Linguana mascot—check out her portfolio to see more of her work!