Girls Frontline ReactJS Wiki

Database last updated on January 13, 2021.

This project serves to provide a mobile-friendly web application of a wiki hosted on GitHub featuring the mobile game, Girls' Frontline by Mica Team, based on the React + Material UI framework.

Table of Contents

• Planned Features
• TODO List
• Installation
• How to host locally
• How to build and deploy to your GitHub Pages
• License

Features

• Stats and animations of all T-Dolls (Tactical Dolls) in the game as of January 13, 2021.

• Information on equipment and their effects when equipped on T-Dolls.

• Information on Fairies.

• Information on HOCs (Heavy Ordnance Corps).

• Formation Simulator that can help you plan out your formations with tile buffs, equipment, and Fairies showing updated T-Doll stats.

^{Go back to top}

TODO List

• Mock up the pages for the app.
• Create initial structure of JSON data object that will hold all T-Dolls.
• Set up filters and searching functionality for T-Dolls.
  • Finalize the Chip components.
  • Save filters when moving to and from T-Doll Index page for persistence. (Maybe have a "Clear Filters" button)
  • Add 6* rarity filter to depict the Mod of 5*'s. Make it only show up by clicking on the Mod Filter Button. (Did not add a 6* rarity filter but rather had the 5* rarity filter show the 6* Mods instead)
• Add T-Dolls #1 to #10 to JSON data object.
• Add functionality to view information for each T-Doll.
• Add images and animations. (GIFs, not Spine unfortunately)
  • Rework the logic such that clicking on the GIF plays the next animation and loops back around when you reach the last animation.
• Add T-Dolls #11 to 320 (currently as of October 10, 2020)
• Add all Special T-Dolls #1000 to 1027. (currently as of October 10, 2020)
• (HIGH PRIORITY) Add Pagination Component to T-Doll Index page to reduce loading time (made the algorithm already).
• Redo each Normal Card image to get rid of artifacting on the left side of each image. (Doing so will mess up the image resolution and make it too blurry)
• (HIGH PRIORITY) Finish the T-Doll rerolling component on the Home Page.
  • Create logic for the 2 buttons below it and link it to the component.
• Create initial structure of JSON data object that will hold all equipment.
  • Add Special Equipment for the T-Dolls that have Mods or are farmable in-game.
  • (HIGH PRIORITY) Create the Equipment Index page.
    • (MEDIUM PRIORTIY) Set up filters and searching for equipment.
    • (LOW PRIORITY) Add Tooltips to T-Doll skill descriptions that have a reference to Special Equipment.
    • (MEDIUM PRIORITY) Add a way to go to the T-Doll from its exclusive equipment.
    • (MEDIUM PRIORITY) Display all exclusive equipment linked to a T-Doll on its page.
• (MEDIUM PRIORITY) Create data model for HOCs.
  • (MEDIUM PRIORITY) Create the HOC Index page.
  • (LOW PRIORITY) Add in the animations of the HOCs.
• (LOW PRIORITY) Create the data model for Fairies.
  • (LOW PRIORITY) Create the Fairy Index page.
  • (LOW PRIORITY) Add in the animations of the Fairies.
• (LOW PRIORITY) Create the Formation Simulator page.
  • (LOW PRIORITY) Create logic to connect the T-Dolls' stats and tiles to equipments and fairies buffs.
• (LOW PRIORITY) Add functionality to see the stats of equipped T-Dolls.
• (LOW PRIORITY) Add build times for T-Dolls.
• (LOW PRIORITY) Add build times for equipment.
• (LOW PRIORITY) Add build times for Fairies.
• (LOW PRIORITY) Update the database from its last updated state of October 10, 2020 to the latest.

^{Go back to top}

Installation

Use the package manager npm or yarn to install all dependencies that the app requires.

npm install

yarn install

^{Go back to top}

How to host locally

# Deploys on localhost:3000
npm run start

yarn start

^{Go back to top}

How to build and deploy to your GitHub Pages

# This assumes that you have GitHub Pages running properly when you forked this project.
npm run deploy

yarn deploy

^{Go back to top}

License

GNU GPL 3.0

^{Go back to top}