The pandemic has forced us to go virtual in nearly every aspect of our lives. Many children have never been to or remember going to a museum or conservatory, and may only know about them through video games and TV. Our goal with the ACNH Field Guide was to create a companion to Animal Crossing that would allow families to easily learn more while playing the game and tracking their progress. With ACNH Field Guide, kids can learn about bugs and fish while collecting them for their in-game museum, nurturing their science education and creating a more in-depth museum experience.
The ACNH Field Guide contains a database of all fish and insects in the video game Animal Crossing: New Horizons. Each entry contains information regarding the creature and links to external websites to learn more about them. Users can search the list for creatures they've caught and add them to their collection, so they can keep track of what they already have, and what they still need to catch.
This project was built with Vue, NuxtJS, TailwindCSS, Firebase and utilized the public Animal Crossing API.
- We hope to implement image recognition so users are able to look up a physical animal in real life through their phone camera
- We hope to implement a geo caching feature so users are able to go out to a physical location and collect/see animal crossing animals in real life through the game.
# install dependencies
$ npm install
# serve with hot reload at localhost:3000
$ npm run dev
# build for production and launch server
$ npm run build
$ npm run start
# generate static project
$ npm run generateFor detailed explanation on how things work, check out the documentation.
You can create the following extra directories, some of which have special behaviors. Only pages is required; you can delete them if you don't want to use their functionality.
The assets directory contains your uncompiled assets such as Stylus or Sass files, images, or fonts.
More information about the usage of this directory in the documentation.
The components directory contains your Vue.js components. Components make up the different parts of your page and can be reused and imported into your pages, layouts and even other components.
More information about the usage of this directory in the documentation.
Layouts are a great help when you want to change the look and feel of your Nuxt app, whether you want to include a sidebar or have distinct layouts for mobile and desktop.
More information about the usage of this directory in the documentation.
This directory contains your application views and routes. Nuxt will read all the *.vue files inside this directory and setup Vue Router automatically.
More information about the usage of this directory in the documentation.
The plugins directory contains JavaScript plugins that you want to run before instantiating the root Vue.js Application. This is the place to add Vue plugins and to inject functions or constants. Every time you need to use Vue.use(), you should create a file in plugins/ and add its path to plugins in nuxt.config.js.
More information about the usage of this directory in the documentation.
This directory contains your static files. Each file inside this directory is mapped to /.
Example: /static/robots.txt is mapped as /robots.txt.
More information about the usage of this directory in the documentation.