Lectores urbanos is a non-profit organization whose goal is to encourage critical thinking. Its central strategy is to promote the habit of reading, art, and social values. Lectores Urbanos currently operates in Mexico.

The goal is to allow people to access free online books by scanning a QR code. People can find the QR code by visiting their physical school buildings, buying food from their favorite shops, and more.

This web app is a prototype/MVP. It uses Next.js for the front end and Sanity to handle its content. For the styling, we are using Chakra UI, which offers suitable solutions for building accessible components.

The use of a headless CMS like Sanity is to allow admin users to maintain the content without needing programming skills. It comes with a native Sanity Studio that offers features like instant side-by-side content previews, intuitive editing, image transformation, and content deployment scheduling.

Note

This app uses the /pages directory for Next.js routing for now. Thinking of migrating it to the app directory later on once it gets more stable.

npm install && npm run dev

git add .
git commit
git push

Alternatively, you can deploy using the Vercel CLI:

npx vercel --prod

Homepage

Book page

Studio page

404

• add authentication to distinguish admin users from regular users
• implement route permissions:
  • admin should have access to studio
  • registered users should have access to all books
  • guests users coming from scanning a physical QR code should only have access to the company page + book page the QR code is associated to
• integrate stripe for registration
• Generate dynamic QR code as part of the company creation + allow admins to download it
• polish transitions for PDF rendering (loading state is in english => replace with spinner + error state if not https + kill or decrease scroll up)
• add analytics
• send automatic emails to users after monthly rotation of books