# Skills Overview

## [Lotide](https://github.com/RhysWood/lotide) - Javascript Fundamentals

For this project I created a clone of the lodash JavaScript library to practice creating various types of functions using JS.

The Lotide project is a modular collection of functions that operate on data, namely Arrays and Objects. In creating these functions, I became more comfortable with FOCAL as well as writing modular code and Automated Testing (by writing unit tests with). At first, I create my own assertion functions for writing test code, but by the end of the project I implimented the industry-standard libraries Mocha and Chai for my automated testing. Through Lotide, I also learned about software dependencies, package managementand NPM. I then published my Lotide library [as an NPM here](https://www.npmjs.com/package/@rhyswood/lotide)

### tl;dr
- Identified the value of using libraries in a software development project
- Learned to iterate through arrays, objects and strings.
- Wrote functions to solve problems
- Practiced writing modular code
- Manipulated and tested values
- Built and published a reusable library


## [ISS Spotter](https://github.com/RhysWood/iss_spotter) - Networking, HTTP & API integration
### ISS Passover App
The ISS Spotter project taught me how to make, manipulate & itegrate API requests. The mini app takes in a users IP address using  [ipify](https://www.ipify.org/), uses this IP address to find the users location using [FreeGeoIP](https://freegeoip.app/) and passes it into the iss-pass url request, eg:
> `https://iss-pass.herokuapp.com/json/?lat=${coords.latitude}&lon=${coords.longitude}`;

![iss passover](docs/iss.png)

>The result shows the next 5 passover times! 

## [TinyApp](https://github.com/RhysWood/tinyapp) - Server Side (Node.js & Express)

Drawing on the fundamentals of Networking with HTTP and JavaScript, I built an Express Server that handles requests from the browser (client). TinyApp is a web application which allows users to shorten long URLs, much like TinyURL.com and bit.ly do. This project also introduced me to sessions and cookies, creating paths for users to log in and access their personalized data. 

This Project taught me how to:
- Build a server that handles client requests
- Develop familiarity with the fundamental concepts that JavaScript relies on to handle asynchronous operations (promises and callbacks).
- Work with cookies and sessions securely (using encrypted cookies)
- Store passwords securely (encryption vs hashing)
- Manage permissions and implement user authentication using best practices
- Use template engines to render web pages server-side

![tinyApp screenshot](docs/userURLs.png)

## [Tweeter](https://github.com/RhysWood/tweeter) - A Single Page App (SPA) built with HTML, CSS, JS, jQuery and AJAX.

Tweeter is a single-page Twitter clone, where users can create short posts of up to 140 characters and have them append to the main page. Posts are sequential, with the most recent posts appearing at the top of the page. To do so, Tweeter fetches a list of posts from a simplified ‘server’ and allows users to add posts to this list dynamically. All the requests will be made asynchronously, which will allow us to gain familiarity using the jQuery library to make these requests.

This Project taught me how to:

- Build a single page application
- Connect the frontend to a pre-built backend
- Execute on a given design spec

!["Char-CounterScreenshot"](docs/char-count.gif)
>Character Counter -- Using jQuery I was able to impliment a real time character counter, turning red once the count surpasses 140 characters.

!["Char-CounterScreenshot"](docs/media-query.gif)
>Using CSS Media Queries, I created a dynamic web app which switches to a mobile layout once the width shrinks below 1024px.


## [LightBnb](https://github.com/RhysWood/LightBnb)
The purpose of this project was to design a database and use server-side JavaScript to display the information from queries to web pages. I was able to apply my existing knowledge of complex SQL queries, database and ERD (entity relationship diagram) design to integrate the database with a Node backend.

This Project taught me how to:
- Design the database and create an ERD for the tables.
- Create the database and the tables using the ERD.
- Add fake data to the database to make testing queries easier.
- Write queries.
- Connect the database to a JavaScript application in order to interact with the data from a web page.

!["homepage"](docs/search.png)
> Users have the ability to carry out custom searches using one or multiple criteria to search for the listing which is right for them.

!["homepage"](docs/LoggedIn.png)
> Users  have the opportunity to log in and view their listings and reservations, personalized to them.

!["ERD Screenshot"](docs/erd_lighthouseBnB.png)

> This ERD shows the relationship between the tables within the database, making it easier to understand the SQL queries within the app. (Created using dbdiagram.io)

## [Midterm](https://github.com/lenilsamuel/Pop-Eats) - Work in Progress! 

For my midterm project I am currently creating a food ordering app for a single restaurant. The restaurant and client are both notified when an order is placed, since this app serves as an intermediary.

When an order is placed, the restaurant receives the order via SMS. The restaurant can then specify how long it will take to fulfill it. Once they provide this information, the website updates for the client and also notifies them via SMS.

We have integrated a modern telecomm API service called Twilio to implement SMS communication from the website to the client and restaurant.

This project required me to work in a team of three people, teaching me some valuable GitHub skills such as dealing with merge conflicts. 

![PopEats Screenshot](docs/order-demo.gif)