dForDeveloper / nasa-apod

Home Page:https://nasa-apod-vue.firebaseapp.com/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

NASA Astronomy Picture of the Day is a mobile-friendly Vue app that displays the current NASA Astronomy Picture of the Day and all the pictures of the current month. Building this app in two days was my first experience using Vue and Vue Router.

How to Use the App:

As a User:

  • Go to the website
  • You should be automatically redirected to the current picture of the day
  • Click the left button to view the previous day's picture
  • Click on the link for all pictures to view all the month's pictures on one screen
  • Click on any picture's card to view a larger version of that image/video
  • Click on the link for today to go back to the current day's picture

As a Contributor:

  • Fork the repo
  • Open your terminal
  • cd to where you want the repo directory to be created
  • Clone your fork down to your machine either
    • with SSH: git clone git@github.com:yourusername/nasa-apod.git
    • or with HTTPS: git clone https://github.com/yourusername/nasa-apod.git
  • cd nasa-apod
  • npm install
  • Sign up for a NASA API key here
  • Create a file in the root directory named .env.local
  • In that file add VUE_APP_BASE_URL=https://api.nasa.gov/planetary/apod?api_key=yourAPIkey
  • npm run serve to start the app at http://localhost:8080
  • Push changes up to your fork
  • Make pull requests from your fork to the original repo

Preview of the App

Desktop View

NASA Astronomy Picture of the Day Desktop Preview

Mobile View

NASA Astronomy Picture of the Day Mobile Preview

Technologies Used:

  • Vue
  • Vue Router

Contributors:

About

https://nasa-apod-vue.firebaseapp.com/


Languages

Language:Vue 84.7%Language:JavaScript 9.7%Language:HTML 5.6%