ti7oyan / resumilo

Resumilo is a platform for people to submit summaries of their favourite topics or subjects.

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

npm run dev
# or
yarn dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying pages/index.tsx. The page auto-updates as you edit the file.

API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.ts.

The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.

Learn More

To learn more about Next.js, take a look at the following resources:

• Next.js Documentation - learn about Next.js features and API.
• Learn Next.js - an interactive Next.js tutorial.

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

resumilo's Issues

Use dynamic imports to reduce bundle size.

As the title says, using dynamic imports will help to reduce the bundle size that it's not as low as we would like.

using next/dynamic or just JavaScript's dynamic imports will hopefully help with this.

Reduce `firebase/auth` shipped size.

This can be achieved overriding the default getAuth() function and initializating it with custom parameters.

docs: https://firebase.google.com/docs/auth/web/custom-dependencies

Improve user's sign-up flow.

Actually, as the user signs up will be redirected to the landing page. This is not exactly the behavior we're looking for (as well for login flow).

One more appropriate approach will be to redirect the new user to the /profile page, where they are going to be able to change their username and avatar, and then redirect them to the index page where the latest summaries will be displayed.

For the log-in flow, the user will be redirected to /resumenes/ instead of the landing page.

Also, we want a start or sign-up button that redirects the user to the log-in page and only if it's already authenticated redirect them to the summaries page, not redirect them to summaries page and if they aren't authenticated redirect them to the log-in page.

Updating the user's profile without an avatar causes to lost the previous one.

Replace useEffect with React Query

It's well known that useEffect represents a problem, because it starts after the UI has been rendered.

React Query manage to solve this problem.

possible: Upload to unlock

This is more like a business decision, but making mandatory to upload a file before downloading can cause two consequences:

• Increase the quantity of summaries and the participation of the users

or...

• Decrease the user base, because not everyone have a summary to upload or want to.

The date submitted with the resumen is broken.

e.g.: for 2022-9-25, it submits 2022-24-25.

POSSIBLE SOLUTION: Review formatting options of date-fns.

Review colors' contrast.

This is an design-related issue and easy to solve.

SOLUTION: Replace colors in styles/theme.css.ts with accessibility-friendly colors.

Look for improvements in Authentication logic

Using React Context API may be a good option to catch an eye on it, Next.js has a very good example with Firebase in its repository.

Dropzone doesn't open file manager on click

Replace "window.location.replace" with Next.js's router

This maybe it's just a visual change, but it doesn't hurt any structural thing.

Dropzones doesn't accept the expected files

In mobile, we can't submit any image to the preferences dropzone or a Word file to the creation dropzone.

Also, when submitting files with long names, the UI brokes.

Add delete actions for summaries and accounts

Users need to be able to delete their accounts, as well as their summaries.

Improve summary card and page

Showing author's information in their summary's page is important.

Also, we need to set the summary card as a simple but well designed component that doesn't confuse the users.

Some posible additions:

• Summary rating, commentaries...
• Share button
• (add more here)

Replace alerts with toasts and add them to progressive actions.

Using toasts (from Chakra UI, for example) gives important visual information to users.

Infinite refresh loop when redirected to /login

feature: Summary search bar

This is maybe critical at some point, because we want the users to find their desired summary fast.

Keep the landing page as static as possible.

The landing page will be one of the most populated pages across the application, so keeping it out of resource-hungry third party services like Firebase's authentication it's the priority.

Possible solution: remove authentication (currently working inside the header) from the landing page, keeping only HTML elements (or those created by the UI library). The idea is to keep the user's flow outside the landing page, so it's not needed to go there for anything, more than seeing some graphics and visuals.

For this, we've to change the logic behind authentication and URL redirection that we have until now, so we can, at least, have a fast first load for the landing page.

Posts at hour 24 can't be uploaded.

This happens because the client creates the date with the hour 24 instead of 0, resulting in an undefined value for the backend.