Shikimori

Shikilove - is a convenient tool for tracking anime, based on the Shikimori platform.

User features:

• Ease of Use: A simple and intuitive interface for quickly adding anime to your list.
• Modern Interface: An aesthetically pleasing and modern design that makes using the site enjoyable.
• Extensive Database: Access to a vast database of anime with information on genres, reviews, and ratings.
• Full Integration with Shikimori: All data is stored on Shikimori's servers.
• Privacy and zen: no analytics, advertising or other distractions

Developer features:

• Clean development - React, scss modules, vite
• Clear file structure
• WIP (Work in Progress)

Project lifecycle

• Planning - design, functionality

• Development

  • Alpha - Working application implementing 80% of the functionality ( + closed testing )
  • Beta - 100% of the functionality, preparing for release, collecting feedback, improving UX ( + open testing )
  • Optimization - This is a big stage of project development, as big as the problem with the performance of web applications. The most difficult stage on which I will spend much more time than others ( + refactoring)
  • Release - Stable version, everything planned has been implemented and works fine, I hope...

• Documentation (handbook) - A big chapter in my becoming a programmer. Understand what a developer needs for comfortable implementation in an open source project

• Further support for the project - This is a pet project, but I will do my best to make it something bigger

Todos

• Rewrite util getPosterImage(link) to getPosterImage(images) like (original, preview, x48, x96) and select image depending on various factors (mobile phone, mobile Internet 3g, lite mode from settings) ( at the moment this is not possible due to browser limitations )
• Add info on hover genres
• Add AnimeEpisodeSelector
• Add Add function to change episodes and status
• Add chip in AnimeCard with anime status and watched episodes

Changelog

• 0.1.0 - This release is aimed at updating the existing functionality and redesign.
• 0.2.0 - Adaptive for mobile devices.

Current progress

• Pages

  • AnimePage
  • ProfilePage
  • SearchPage
  • SettingsPage
  • LoginPage
  • LogoutPage

• UI - ui components

  • Typography
  • ButtonGroup
  • Button
  • IconButton
  • ImageView
  • Chip
  • SelectField

• Features - business components

  • AnimeCard

• Widgets

  • Sidebar

Special thanks

• Shikimori - for their significant contribution to the popularization of anime in Russia, the wonderful graphql api and the terrible rest api :)

before optimization

dist/assets/ProfilePage-DoaFBpWC.js 8.46 kB │ gzip: 3.41 kB dist/assets/GlobalLayout-CgoHViWO.js 9.89 kB │ gzip: 4.21 kB dist/assets/LoginPage-Df1aT2Zd.js 21.66 kB │ gzip: 9.69 kB dist/assets/Button-BmCQ9KPk.js 35.56 kB │ gzip: 14.32 kB dist/assets/useQuery-CAE5pBCE.js 36.21 kB │ gzip: 10.32 kB dist/assets/AnimePage-CW-vJVjy.js 99.82 kB │ gzip: 35.90 kB dist/assets/proxy-DdvPhqVr.js 110.35 kB │ gzip: 36.14 kB dist/assets/index-BxqmWD6u.js 371.42 kB │ gzip: 118.10 kB

after optimization