https://github.com/neandreev/FreeTalk-NextJS

Сайт-сервис для перевода, изучения и повторения иностранных слов
https://github.com/neandreev/FreeTalk-NextJS

ant-design next-auth nextjs prisma react trpc zustand

Last synced: 3 months ago
JSON representation

Сайт-сервис для перевода, изучения и повторения иностранных слов

• Host: GitHub
• URL: https://github.com/neandreev/FreeTalk-NextJS
• Owner: neandreev
• License: mit
• Created: 2022-06-21T08:24:34.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2023-04-22T12:52:17.000Z (almost 2 years ago)
• Last Synced: 2024-07-30T21:09:41.222Z (6 months ago)
• Topics: ant-design, next-auth, nextjs, prisma, react, trpc, zustand
• Language: TypeScript
• Homepage: https://free-talk-next-js.vercel.app
• Size: 1.57 MB
• Stars: 1
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        


	FreeTalk





	

	

	





	Сайт-сервис для перевода, изучения и повторения иностранных слов.





	Ссылка: https://free-talk-next-js.vercel.app





![PageSpeed](https://gist.githubusercontent.com/neandreev/d92e2b7e58dd903a609271efa20f745c/raw/4b2193c41f3e438bfb62dadfd3f82ac76bdf11f9/pagespeed.svg)



> [![screenshot][1]][1]

  [1]: https://www.neandreev.ru/images/FreeTalk.webp

Форк https://github.com/neandreev/FreeTalk с мажорными изменениями стека:

- [Create React App](https://create-react-app.dev) ==> [NextJS](https://nextjs.org)

	- Позволил имплементировать Server-Side Rendering

	- Избавил от React-Router

	- Изначально содержит в себе множество способов оптимизации производительности приложения

- [Firebase Authentication](https://firebase.google.com/docs/auth) + кастомный useAuth ==> [NextAuth](https://next-auth.js.org)

	- Позволяет авторизовываться через OAuth посредством встроенных провайдеров (от Google до VK)

	- Остается возможность авторизовываться через почту посредством [Nodemailer](https://nodemailer.com/about/)

	- Хранение пользователей нативно встроено посредством возможности подключения адаптеров к популярным базам данных

- [Firebase Database](https://firebase.google.com/docs/database) ==> [Prisma](https://www.prisma.io) + [PlanetScale](https://planetscale.com)

	- Переход с ограниченной JSON базы данных на MySQL-совместимую базу данных PlanetScale позволил более точно описать объекты предметной области, и также намного удобнее изменять и получать данные из базы данных.

	- В отличие от популярных ORM, Prisma позволяет описывать модели приложения декларативно и просто (в форме [Prisma Schema](https://www.prisma.io/docs/concepts/components/prisma-schema))

	- Описывал модели приложения через Prisma, я также автоматически получаю их TypeScript типы, что приятно)

- [Redux RTK Query](https://redux-toolkit.js.org/rtk-query/overview) ==> [tRPC](https://trpc.io)

	- TypeSafe API из коробки

- [Redux Toolkit](https://redux-toolkit.js.org) ==> [Zustand](https://github.com/pmndrs/zustand)

	- RTK Query больше не нужен, а он - очень большой довод в пользу Redux

	- Zustang позволяет писать store'ы с намного меньшим boilerplate-кодом, при этом не лишая основного функционала redux

	- Весит всего ~1Kb