Skip to content

runway-reviews/runway-reviews-fe

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Runway Reviews Tests

💾 Technologies Used

HTML5 CSS3 Vue.js Visual Studio Code GitHub NPM Cypress

Deployed Link:

Runway Reviews

👩‍💻 👩‍💻 👨‍💻 👩‍💻 Collaborators

Front-End : Emalee Poellot | Amy Siu | Zen Mcmillan

Back-End: Justin Lee | Brendan Bondurant | Blake Sergesketter| Nathan Trautenberg

🎥 Preview

Screen.Recording.2024-03-04.at.4.01.34.PM.mov

💭 Abstract

The goal of this project is to create an application that allows users to travel with more comfort and be more prepared, knowing the amenities an airport contains, and how clean their bathrooms are, along with the options for food at the restaurant, security, and additional information provided by other travelers. It's useful for those who travel and valuable to have on hand. For example, knowing the security and time it takes is helpful, or food options for dietary restrictions, planning to get food ahead of time, and bathroom cleanliness and other amenities is useful.

This project allows a user to log into their account and view the reviews they made for a particular airport. They can also add a review of the airport based on a list of categories from a dropdown menu. They can then view the review that was just made. This project uses several different APIs to get a list of airports, for the user to log in, and to show the reviews.

We were able to integrate Google Cloud AI into our project to translate most of the features of the application into the top five most commonly spoken languages to increase user accessibility.

🚀 Google Cloud AI Translate Integration Steps

Enable the Translate API:

  1. Go to the Google Cloud Console.
  2. Create a new project or select an existing one.
  3. Navigate to the API & Services > Dashboard.
  4. Click on "+ ENABLE APIS AND SERVICES" and search for "Cloud Translation API." Enable it for your project.

Create API Key or Service Account:

  • For simplicity, you can create an API key. Go to API & Services > Credentials, and create an API key.
  • Alternatively, you can create a service account and download the JSON file. Ensure you keep this file secure.

Install Google Cloud Translate SDK:

  • You'll need the @google-cloud/translate Node.js package. Install it using:
    npm install --save @google-cloud/translate

Use Google Cloud AI Translate in your JavaScript code:

const {Translate} = require('@google-cloud/translate').v2;

const translate = new Translate({keyFilename: 'path/to/your/keyfile.json'});

// Example: Translate text from English to Spanish
async function translateText() {
  const [translation] = await translate.translate('Hello, world!', 'es');
  console.log(`Text: ${translation}`);
}

translateText();
</details>

## Deployed Link
[Deployed](https://runway-reviews.github.io/runway-reviews-fe/) 
Username: Jeanette Akenja Nearing
Password: $2a$12$0EhXvY8u12yBUdE/QLdkHuzBMQmRTXmJb25FWNSoysvQfk1FVnNUq
To be able to add a review, the user must be logged in. Use the above username and password.


## 📝  Context
We are a group of 2 front-end developers and 3 back-end developers who worked together remotely via Zoom and asynchronously through the GitHub project board to complete this application. This project was completed from week 1 to week 3 in Mod 4 at Turing School of Software & Design. It was our first time using the Vue framework.


## 🔌 Server Setup
1. Clone the repository: Open a terminal window. Navigate to the directory where you want to clone the repository. Run the following command: git clone 
2. Install the dependencies: Run the following command in the cloned repository directory: npm install
3. Run the React app: Run the following command in the cloned repository directory:

## 📚 Learning Goals

-Develop a basic understanding of the Vue framework


## 🥇 Wins
⭐ Emalee: Learning Vue was really fun for me, and it felt good to be able to build an app from it
⭐ Amy: Learning a bit of Vue was fun and new and implementing google translate ai was fun as well.

## 🚧 Challenges
❗Posting a review was difficult because there seemed to be a timing issue.