From 1c9208e20ad0c1c207b8c13c0f362d29bce8ee0c Mon Sep 17 00:00:00 2001 From: leoRysing Date: Mon, 15 Jan 2024 09:54:12 -0500 Subject: [PATCH 1/4] making sure frontend is connected to backend --- frontend/App.tsx | 20 +++++++++++++------- frontend/babel.config.js | 2 +- frontend/services/users.ts | 2 ++ frontend/tailwind.config.js | 24 +++++++++++++----------- frontend/types/types.d.ts | 6 +++--- 5 files changed, 32 insertions(+), 22 deletions(-) diff --git a/frontend/App.tsx b/frontend/App.tsx index 25f1dbef..0f809b6e 100644 --- a/frontend/App.tsx +++ b/frontend/App.tsx @@ -8,17 +8,22 @@ export default function App() { const [users, setUsers] = useState(); useEffect(() => { getAllUsers().then((data) => setUsers(data)) - }) + }, []) return ( - Open up App.js to start working on your app! + Open up App.js to start working on your app! { users && - users.map((user, index) => ( - - {`FirstName: ${user.firstName} LastName: ${user.lastName}`} - - ))} + + { + users.map((user, index) => ( + + {`First Name: ${user.first_name}\n`}{`Last Name: ${user.last_name}`} + + )) + } + + } ); @@ -30,5 +35,6 @@ const styles = StyleSheet.create({ backgroundColor: '#fff', alignItems: 'center', justifyContent: 'center', + paddingHorizontal: 20, }, }); diff --git a/frontend/babel.config.js b/frontend/babel.config.js index bec089e1..745741b3 100644 --- a/frontend/babel.config.js +++ b/frontend/babel.config.js @@ -1,4 +1,4 @@ -export default function(api) { +module.exports = function(api) { api.cache(true); return { presets: ['babel-preset-expo'], diff --git a/frontend/services/users.ts b/frontend/services/users.ts index 186de6da..00dc1ab0 100644 --- a/frontend/services/users.ts +++ b/frontend/services/users.ts @@ -3,6 +3,8 @@ import { API_LINK } from './CommonURLS'; import { User } from '../types/types'; export const getAllUsers = async (): Promise => { + console.log(API_LINK) const response: AxiosResponse = await axios.get(`${API_LINK}/users`); + console.log(response.data) return response.data; } \ No newline at end of file diff --git a/frontend/tailwind.config.js b/frontend/tailwind.config.js index 46d48b30..d2e871c8 100644 --- a/frontend/tailwind.config.js +++ b/frontend/tailwind.config.js @@ -1,13 +1,15 @@ /** @type {import('tailwindcss').Config} */ -export const content = [ - "./App.{js,jsx,ts,tsx}", - "./components/**/*.{js,jsx,ts,tsx}", - "./public/**/*.{js,jsx,ts,tsx}", - "./screens/**/*.{js,jsx,ts,tsx}", - "./services/**/*.{js,jsx,ts,tsx}" -]; -export const theme = { - extend: {}, -}; -export const plugins = []; \ No newline at end of file +module.exports = { + content: [ + "./App.{js,jsx,ts,tsx}", + "./components/**/*.{js,jsx,ts,tsx}", + "./public/**/*.{js,jsx,ts,tsx}", + "./screens/**/*.{js,jsx,ts,tsx}", + "./services/**/*.{js,jsx,ts,tsx}" + ], + theme: { + extend: {}, + }, + plugins: [] +} \ No newline at end of file diff --git a/frontend/types/types.d.ts b/frontend/types/types.d.ts index 136de7e7..7eaa5882 100644 --- a/frontend/types/types.d.ts +++ b/frontend/types/types.d.ts @@ -1,6 +1,6 @@ export interface User { - firstName: string; - lastName: string; - password: string; + first_name: string; + last_name: string; + pass_word: string; email: string; } \ No newline at end of file From 66699fe67d81f5653f2279c42f29920678bd9c2a Mon Sep 17 00:00:00 2001 From: leoRysing Date: Mon, 15 Jan 2024 10:22:14 -0500 Subject: [PATCH 2/4] quick fe renaming, + swagger now up --- Makefile | 2 +- backend/docs/docs.go | 104 ++++++++++++++++++++++++++++++++++ backend/docs/swagger.json | 79 ++++++++++++++++++++++++++ backend/docs/swagger.yaml | 54 ++++++++++++++++++ backend/main.go | 1 + backend/src/docs/swagger.json | 50 ++++++++++++++++ backend/src/docs/swagger.yaml | 33 +++++++++++ 7 files changed, 322 insertions(+), 1 deletion(-) create mode 100644 backend/docs/docs.go create mode 100644 backend/docs/swagger.json create mode 100644 backend/docs/swagger.yaml create mode 100644 backend/src/docs/swagger.json create mode 100644 backend/src/docs/swagger.yaml diff --git a/Makefile b/Makefile index d3137c47..d424c970 100644 --- a/Makefile +++ b/Makefile @@ -36,7 +36,7 @@ backend-format: cd backend && go fmt # Build the docker db -.PHONY: backend-docker +.PHONY: db-dep backend-docker: docker-compose up diff --git a/backend/docs/docs.go b/backend/docs/docs.go new file mode 100644 index 00000000..0210a932 --- /dev/null +++ b/backend/docs/docs.go @@ -0,0 +1,104 @@ +// Package docs Code generated by swaggo/swag. DO NOT EDIT +package docs + +import "github.com/swaggo/swag" + +const docTemplate = `{ + "schemes": {{ marshal .Schemes }}, + "swagger": "2.0", + "info": { + "description": "{{escape .Description}}", + "title": "{{.Title}}", + "contact": {}, + "version": "{{.Version}}" + }, + "host": "{{.Host}}", + "basePath": "{{.BasePath}}", + "paths": { + "/api/users/": { + "get": { + "description": "Returns all users", + "produces": [ + "application/json" + ], + "tags": [ + "user" + ], + "summary": "Gets all users", + "operationId": "get-all-users", + "responses": { + "200": { + "description": "OK", + "schema": { + "type": "array", + "items": { + "$ref": "#/definitions/models.User" + } + } + }, + "404": { + "description": "Failed to fetch users", + "schema": { + "type": "string" + } + } + } + } + } + }, + "definitions": { + "models.User": { + "type": "object", + "required": [ + "email", + "first_name", + "last_name", + "pass_word" + ], + "properties": { + "created_at": { + "type": "string", + "example": "2023-09-20T16:34:50Z" + }, + "email": { + "type": "string" + }, + "first_name": { + "type": "string" + }, + "id": { + "type": "integer", + "example": 1 + }, + "last_name": { + "type": "string" + }, + "pass_word": { + "type": "string" + }, + "updated_at": { + "type": "string", + "example": "2023-09-20T16:34:50Z" + } + } + } + } +}` + +// SwaggerInfo holds exported Swagger Info so clients can modify it +var SwaggerInfo = &swag.Spec{ + Version: "1.0", + Host: "", + BasePath: "/api", + Schemes: []string{}, + Title: "Algo API", + Description: "API for Algo App", + InfoInstanceName: "swagger", + SwaggerTemplate: docTemplate, + LeftDelim: "{{", + RightDelim: "}}", +} + +func init() { + swag.Register(SwaggerInfo.InstanceName(), SwaggerInfo) +} diff --git a/backend/docs/swagger.json b/backend/docs/swagger.json new file mode 100644 index 00000000..71449e4f --- /dev/null +++ b/backend/docs/swagger.json @@ -0,0 +1,79 @@ +{ + "swagger": "2.0", + "info": { + "description": "API for Algo App", + "title": "Algo API", + "contact": {}, + "version": "1.0" + }, + "basePath": "/api", + "paths": { + "/api/users/": { + "get": { + "description": "Returns all users", + "produces": [ + "application/json" + ], + "tags": [ + "user" + ], + "summary": "Gets all users", + "operationId": "get-all-users", + "responses": { + "200": { + "description": "OK", + "schema": { + "type": "array", + "items": { + "$ref": "#/definitions/models.User" + } + } + }, + "404": { + "description": "Failed to fetch users", + "schema": { + "type": "string" + } + } + } + } + } + }, + "definitions": { + "models.User": { + "type": "object", + "required": [ + "email", + "first_name", + "last_name", + "pass_word" + ], + "properties": { + "created_at": { + "type": "string", + "example": "2023-09-20T16:34:50Z" + }, + "email": { + "type": "string" + }, + "first_name": { + "type": "string" + }, + "id": { + "type": "integer", + "example": 1 + }, + "last_name": { + "type": "string" + }, + "pass_word": { + "type": "string" + }, + "updated_at": { + "type": "string", + "example": "2023-09-20T16:34:50Z" + } + } + } + } +} \ No newline at end of file diff --git a/backend/docs/swagger.yaml b/backend/docs/swagger.yaml new file mode 100644 index 00000000..9d437be7 --- /dev/null +++ b/backend/docs/swagger.yaml @@ -0,0 +1,54 @@ +basePath: /api +definitions: + models.User: + properties: + created_at: + example: "2023-09-20T16:34:50Z" + type: string + email: + type: string + first_name: + type: string + id: + example: 1 + type: integer + last_name: + type: string + pass_word: + type: string + updated_at: + example: "2023-09-20T16:34:50Z" + type: string + required: + - email + - first_name + - last_name + - pass_word + type: object +info: + contact: {} + description: API for Algo App + title: Algo API + version: "1.0" +paths: + /api/users/: + get: + description: Returns all users + operationId: get-all-users + produces: + - application/json + responses: + "200": + description: OK + schema: + items: + $ref: '#/definitions/models.User' + type: array + "404": + description: Failed to fetch users + schema: + type: string + summary: Gets all users + tags: + - user +swagger: "2.0" diff --git a/backend/main.go b/backend/main.go index 5f78049a..212d5d6c 100644 --- a/backend/main.go +++ b/backend/main.go @@ -9,6 +9,7 @@ import ( "github.com/gin-gonic/gin" swaggerFiles "github.com/swaggo/files" ginSwagger "github.com/swaggo/gin-swagger" + _ "backend/docs" "gorm.io/driver/postgres" "gorm.io/gorm" ) diff --git a/backend/src/docs/swagger.json b/backend/src/docs/swagger.json new file mode 100644 index 00000000..6e74e9f4 --- /dev/null +++ b/backend/src/docs/swagger.json @@ -0,0 +1,50 @@ +{ + "basePath": "/", + "definitions": { + "types.User": { + "properties": { + "first_name": { + "type": "string" + }, + "last_name": { + "type": "string" + }, + "email": { + "type": "string" + }, + "pass_word": { + "type": "string" + } + }, + "type": "object" + } + }, + "info": { + "contact": {}, + "description": "This is an API for the Algo App.", + "title": "Algo API", + "version": "1.0" + }, + "paths": { + "/users": { + "get": { + "description": "get all users in the database", + "responses": { + "200": { + "description": "OK", + "schema": { + "items": { + "$ref": "#/definitions/types.User" + }, + "type": "array" + } + } + }, + "summary": "Get All users", + "tags": ["users"] + } + } + }, + "swagger": "2.0" +} + \ No newline at end of file diff --git a/backend/src/docs/swagger.yaml b/backend/src/docs/swagger.yaml new file mode 100644 index 00000000..994e4b34 --- /dev/null +++ b/backend/src/docs/swagger.yaml @@ -0,0 +1,33 @@ +basePath: / +definitions: + types.User: + properties: + first_name: + type: string + last_name: + type: string + email: + type: string + pass_word: + type: string + type: object +info: + contact: {} + description: This is an API for the Algo App. + title: Algo API + version: "1.0" +paths: + /users: + get: + description: get all users in the database + responses: + "200": + description: OK + schema: + items: + $ref: '#/definitions/types.User' + type: array + summary: Get All users + tags: + - users +swagger: "2.0" \ No newline at end of file From c51aa7e9f1b04dadf170ac9724761bd2901db7ac Mon Sep 17 00:00:00 2001 From: leoRysing Date: Mon, 15 Jan 2024 10:23:09 -0500 Subject: [PATCH 3/4] makefile + readme update --- Makefile | 2 +- README.md | 25 ++++++++++++++++++++----- 2 files changed, 21 insertions(+), 6 deletions(-) diff --git a/Makefile b/Makefile index d424c970..63e6237f 100644 --- a/Makefile +++ b/Makefile @@ -36,7 +36,7 @@ backend-format: cd backend && go fmt # Build the docker db -.PHONY: db-dep +.PHONY: db-run backend-docker: docker-compose up diff --git a/README.md b/README.md index 785244ea..8145b7e9 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,12 @@ # Algo Fullstack application for the Algo project + + + Workflow Status + + ## Quick Start ```git clone git@github.com:GenerateNU/Algo.git``` @@ -9,8 +15,8 @@ Fullstack application for the Algo project First, understand the tech stack: - The database is [PostGreSQL](https://www.postgresql.org/) and will be containerized using [Docker](https://www.docker.com/). -- The backend is [Golang](https://go.dev/) with [Echo](https://echo.labstack.com/) -- The frontend is [ReactNative](https://reactnative.dev/) with [TypeScript](https://www.typescriptlang.org/) and uses [Expo](https://expo.dev/) as a build tool and [React Navigation](https://reactnavigation.org/) +- The backend is [Golang](https://go.dev/) with [Gin](https://gin-gonic.com/) +- The frontend is [ReactNative](https://reactnative.dev/) with [TypeScript](https://www.typescriptlang.org/) and uses [Expo](https://expo.dev/) as a build tool, [React Navigation](https://reactnavigation.org/) for navigation, and [NativeWind](https://www.nativewind.dev) + [React Native Paper](https://reactnativepaper.com/) for styling Before compiling and running our application, we need to install several languages, package managers, and various tools. @@ -37,8 +43,10 @@ We will be using some tools to make development a bit easier. - [Swagger](https://github.com/swaggo/swag) - Will allow us to visualize the API and query requests from the database. - [Makefile](https://opensource.com/article/18/8/what-how-makefile) - Will allow us to easily run scripts by consolidating them into Makefile commands. Make sure to read up about each command and ask questions. You should know what you are running! -- [xcode](https://docs.expo.dev/workflow/ios-simulator/) - A simulator to view the code on an iphone from a laptop -- [android studio](https://docs.expo.dev/workflow/android-studio-emulator) - An emulator to view the code on an android device from a laptop + +If you wish to simulate the app on a phone on your computer, the following will work; +- [Xcode](https://docs.expo.dev/workflow/ios-simulator/) - A simulator to view the code on an iphone from a laptop +- [Android Studio](https://docs.expo.dev/workflow/android-studio-emulator) - An emulator to view the code on an android device from a laptop ### Third party integrations For this project, we will be using some third-party APIs. @@ -53,8 +61,15 @@ We will be containerizing our PostGreSQL database in Docker. Follow the steps be 1. Install [Docker](https://docs.docker.com/get-docker/) You should be able to run `docker` in your terminal if this was successful. 2. Install [Docker Desktop](https://www.docker.com/products/docker-desktop/) -3. Run `docker-compose up` from the root directory, this will spin up a postgres image. +3. Run `make db-run` from the root directory, this will spin up a postgres image. ### Backend 1. From root directory, run `make backend-run` +2. Once this has succesfuly spun up, run `make backend-ngrok`. This is necessary for connecting to a the different emulators, or your own phone if you download Expo Go. + +### Frontend +1. From the root diectory, as long as you've already run `make frontend-dep` recently, run `make frontend-run`. This will start the expo app. +2. Starting an expo app has choices; it comes prepackeged with a QR code, which you can scan to open the app in Expo Go +3. If you want to run the app on your computer, you will need to make sure you spin up the relevant emulator. This is either an Android Studio emulator if you want to run on Android, or an XCode simulator if you want to run on iOS +4. To run on android, press **a**. To run on iOS, press **i** From 701cadaee58cc7909539e3ffbed5ab647d2fe30a Mon Sep 17 00:00:00 2001 From: leoRysing Date: Mon, 15 Jan 2024 10:29:48 -0500 Subject: [PATCH 4/4] remove es-lint on these files since it is needed to stay as a module.exports --- frontend/babel.config.js | 1 + frontend/tailwind.config.js | 1 + 2 files changed, 2 insertions(+) diff --git a/frontend/babel.config.js b/frontend/babel.config.js index 745741b3..bde3de13 100644 --- a/frontend/babel.config.js +++ b/frontend/babel.config.js @@ -1,3 +1,4 @@ +/* eslint-disable */ module.exports = function(api) { api.cache(true); return { diff --git a/frontend/tailwind.config.js b/frontend/tailwind.config.js index d2e871c8..d910941e 100644 --- a/frontend/tailwind.config.js +++ b/frontend/tailwind.config.js @@ -1,3 +1,4 @@ +/* eslint-disable */ /** @type {import('tailwindcss').Config} */ module.exports = {