dvaji/readerfront

A comic CMS

ReaderFront

A comic reader meant for users to enjoy reading

Codebase

Technologies

• MariaDB: Data storage
• GraphQL: API
• React: Frontend React app

Folder structure

readerfront/
├── packages/
  ├── admin      # Administration control panel
  ├── api        # API server
  ├── shared     # Shared JavaScript code
  ├── ui         # Shared React components
  ├── web        # Frontend NextJS

Requirements:

• Node JS 14
• yarn

Production Installation steps:

Please follow PRODUCTION instructions.

Development Installation steps:

1. Install MariaDB: See the MariaDB documentation for instructions on installing it with your OS.
2. Install the dependencies:

yarn install

Migrating the database

When you first download the code and want to run it locally you have to migrate the database and seed it with test data. First, start mariadb, then, run these commands:

yarn db:migrate

If you want to imoplement the sample data (includes admin users):

yarn setup:db

Running the app locally

Depending on what you're trying to work on you'll need to start different servers. Generally, all servers run in development mode by doing yarn start:<projectname>, e.g. yarn start:api to start the API, but first you have to check the secrets, every project contains a .env.example file with the necessary values.

Develop the API

To develop the API run:

yarn start:api

Develop the web UI

To develop the web UI run:

yarn start:web

Develop the admin UI

To develop the admin UI run:

yarn start:admin

Run All Apps

This is only recommended in dev environment. DO NOT USE THIS IN PRODUCTION!

yarn start:all

Want to help?

Want to file a bug, contribute some code, or improve documentation? Excellent! Read up on our guidelines for contributing

License

MIT

readerfront's Issues

Error Handling

Add errors or screens with messages when:

• The chapter is not found / is invalid
• This is the most recent chapter (the last one available so far).
• The series is not found
• The blog post is not found

RSS por idioma

Para implementar el bot 'anunciador' en Discord, es necesario tener RSS's en varios idiomas (español e inglés) para que envíe mensajes a los canales correspondientes.

Admincp: Add chapters

Admincp: Add Work

Utilizar el nuevo React Context Api

Actualmente no hay un store y esto conlleva a que se debe 'refrescar' cada ruta cuando se pasa a una nueva, para evitar esto actualmente está Redux para el manejo de estados pero en la próxima versión de React traerá una nueva Api.
Articulo: https://medium.freecodecamp.org/replacing-redux-with-the-new-react-context-api-8f5d01a00e8c

Replace deprecated packages and version

Lista

• gulp-minify-css -> gulp-clean-css
• jade -> pug
• .

Cambiar rama principal a master

Auth module

Add a auth module (login, register, reset password)

Actualizar a Bootstrap 4

Utilizar https://reactstrap.github.io/ en vez de https://react-bootstrap.github.io/ dado que aún les faltan muchos componentes por completar.

Show Series Genres

In order to show more complete information about the series, genres should be added.

Releases muestra el nombre del capítulo en vez del nombre de la Serie

Debería mostrar el nombre de la serie.

Link directo a capítulos no funcionan

Cuando la 'cookie' de un idioma distinto al link del capítulo, este no se ve hasta que uno cambia manualmente el idioma.
Se espera que se pueda ver el capítulo independientemente del idioma.

Search for Blog module

To the same as #33 , in order to simplify the search for blog, the idea is to implement a simple search for posts.

Move to a Generator using YO

Because the configuration is somewhat cumbersome, a Yeoman-based generator could be good to ease of installation.

http://yeoman.io/authoring/

No se ven las publicaciones del Blog

Al actualizar a Bootstrap hizo falta actualizar también el módulo Blog, el cuál no se puede utilizar por lo mismo.

Single repository for Client, API and DB

based on: https://github.com/jancarloviray/graphql-react-starter & https://github.com/kriasoft/nodejs-api-starter

Add SSR

Subscribe to new chapters

'Push notifications' can be added using the ServiceWorker.
More info: https://developers.google.com/web/fundamentals/codelabs/push-notifications/?hl=es
https://thecodebarbarian.com/sending-web-push-notifications-from-node-js.html

No se muestran las miniaturas en Releases de algunos capítulos

Al parecer cuando hay un espacio en el nombre de las páginas este no crea el 'thumb' y por ende no se muestra.

Utilizar React

En este cambio se planea utilizar el repositorio: https://github.com/facebookincubator/create-react-app para así tener una base completa de librerías y código de apoyo.

Lazy loading Images

In order to be able to read a chapter without having to wait for it to fully load, lazy loading images should be implemented.
reference: http://mangaraw.online/manga/overlord/chapter-36
https://github.com/RevillWeb/img-2

Problemas al cargar algunos capítulos en el lector (Read)

Hay capítulos que arroja el siguiente error:
Cannot read property 'pages' of undefined

Cambiar a NG4

Módulos a mantener:
Releases
List
Reader

nuevos:
Apply
Blog (debe usar la api de wordpress)

Y usar Redux.

Admincp: Dashboard

Fix empy posts

.

Normalize data with normalizr

https://github.com/paularmstrong/normalizr

Get configuration from API

dvaJi/ReaderFront-API#4

Test

No se pueden leer los capítulos en inglés

Cuando existen tanto en inglés como en español, el lector sólo muestra el capítulo en español y no el seleccionado.

RSS Feed

.

Organizar la estructura de archivos a Componentes Contenedores y de Presentación

Debido a que hay componentes 'repetidos' en algunos módulos, por ejemplo: BlogCard y ReleaseCard, lo mejor será implementar el patrón Presentational and container components .

Admincp: Add People

No funciona el buscador de Series

En el módulo Series el buscador solo detecta la primera tecla y luego se resetea, haciendo imposible poder filtrar/buscar una serie.

Portada por defecto para Series que no la tengan

Actualmente aparece un cuadro transparente con sombra, esto es debido a que hay series que por el momento no tienen una portada, no se puede subir (+18 o algo parecido) o que simplemente no puede tener una (colección de doujinshis, oneshots, etc).

Deploy aplicación (CD)

Para Automatizar la subida de versión y así evitar errores, es necesario implementar un CD.

• Añadir configuración para que haga un deploy con FTP
• Debe funcionar sólo en la rama ravens
• Agregar documentación

Páginas en el lector no tienen un salto de línea

Cuando se está en una mayor resolución y las proporciones de las imágenes es pequeña, resulta en que se agrupan en columnas.

Actualmente
Como debería ser

Agregar botón de Patreon

Actualizar el menú para que obtenga un link de Patreon, este sólo se debe mostrar si no se encuentra configurado, lo mismo para el botón de Discord.

Implement l18n

When changing the language, the text does not change, but the content does:
https://phraseapp.com/blog/posts/react-i18n-best-libraries/

Improve client language detection

https://help.localizejs.com/docs/detecting-language-of-a-visitor

Bug con el link de Bootstrap

el link: https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css ahora apunta a la versión 4 y este es incompatible hasta que se aborde #17 .

Censor the cover of the series when it is +18

To avoid NSFW, it should censor every thumb when the Serie is marked as Adult, there is a boolean property called 'adult' it can be filtered with that.

• Add censorship to Releases
• Add censorship to Home
• Add censorship Series
• Add modal to remove censorship or to access the Series/Read chapter

GAnalitycs

https://github.com/revolunet/angular-google-analytics.

Show Serie Status

The states must be:

Ongoing/In progress
Completed
Dropped

Improve documentation

To be improved/added:

• README with installation, configuration, file structure, contribution and test information.
• Documentation for API.

Advanced Filters for Series module

Currently you can only filter by name, the idea is to give a more personalized filter with the following features:

• Filter by genre (#57)
• Filter by status (#15)
• Filter by category (#56)
• Sort by Name (ASC/DESC) and Last updated (ASC/DESC)

Add Tags to Blog posts

In order to simplify the search in the Blog, it is necessary to add Tags provided by Wordpress.
Info: https://developer.wordpress.org/rest-api/reference/tags/

Actualizar dependencias

Tests (e2e, unit, etc)

.

Change theme

Improve unit testing

Currently, unit tests only cover just over half of the code (especially Branch).

> -------------------------|----------|----------|----------|
> File         |  % Stmts  | % Branch |  % Funcs |  % Lines |
> -------------------------|----------|----------|----------|
> All files    |    70.04  |    46.73 |    79.49 |    70.04 |
> -------------------------|----------|----------|----------|