A-List

A-List is an app that allows you to create a list of your favorite series, and keep track of the latest chapters, typically from fan-hosted sites. Save 5+ minutes a day from refreshing.

Comment 1

Inspiration

Inspiration was from our daily life. As we believe in solving a problem we have and, in turn, can help someone else.

One issue we consistently had was wasting a lot of time refreshing the different websites for manga and novel updates, often leading up to 10-15 minutes wasted every day. We thought that it would be a time saver to have an App that refreshes every series on your list in a matter of a minute. Over a year, that'd save us at least ~3600 minutes across the year.

What it does

Our app, as its name "A-List" suggests, allows users to create a reading list. This serves as the main page of the app, and users can view all of the updates of their reading list on a singular page.

This solves the problem of having to check for updates on multiple series across multiple sites. Granted, we have to make a different web scrape for different sites, but most major websites follow a general template or format, allowing us to make 3-5 web-scraping scripts at most, and we'll cover 90% of the basis.

How we built it

We started by having a team meeting to plan out the UI design and complexity of the app. After, we drew a diagram of the user flow of the app and the associated frameworks we may need.

We also noted the specific flow on the code side as much as possible, such as a flow-chart of our Flutter widgets and mapping out the backend flow.

We settled for a few milestones we can reach if time allows, but ultimately we failed to hit our MVP goal of having a full app working.

Challenges we ran into

Having a team of all first-time Hackathon attendees and being the first non-school project for 3/4 of us, there were many newbie mistakes.

  • Our dev environment was messed up; we wasted several hours making just the code work for everyone.

  • Although planning was good, there were also a lot of concepts we spent a lot of time on, as Flutter was a new language for us. Namely, weird issues with types and Flutter not allowing us to pass certain data.

  • We also had to settle for a more messy codebase due to time restraint caused by said bumps, deviating from some of the code architecture choices we initially planned and having to "hack" many functionalities. (Accumulating code debt and then causing some more issues..)

Accomplishments that we're proud of

While we weren't able to finish the app to the degree we would've liked to, there were many takeaways we were proud of.

  • Making our first mobile app work with states and web data (quite literally, the only other ones we made were from the course we took this week)

  • Finishing our API that works on mangasee123.com, webscrapes associated information requested via request-promise, and having an express server that powers our server and endpoints.

  • Our planning hit pretty much all of the things we faced, and the flow worked as expected, as well as gauged the most difficult parts properly (although took more time than we expected due to issues).

What we learned

There were many things we learned. Well, everything we coded, we had to learn quite literally. None of it we really did before.

  • ExpressJS and concept of API & Backend Server
  • Request-Promise and concept of a web request (as well as Flutter HTTP)
  • Flutter & NodeJS debugging experience
  • Working with data types in a mobile app, experiencing difficulties with passing it around and manipulating it, as well as interacting with a backend server. There were many weird errors we had to troubleshoot and navigate.
  • State management and reflecting data changes on the front end, specifically Flutter.

What's next for A-List

Many. We plan to continue working on the app and use it for ourselves. We will be creating GitHub issues for future features, but here is what you can roughly expect:

  • MongoDB Implementation for cloud storage of user read list
  • Serverside 24hr monitoring so users can be alerted of their read list update without refreshing
  • Cleaning up and refactoring code for future features
  • Re-doing UI for a cleaner look
  • Add reactive clicking and lead users to the latest chapter when the specific series is clicked on.
  • Add a "new" alert & color code for series that haven't been viewed yet
  • Possible Discord integration for updates
Share this project:

Updates