Fixed ports

api/README.md

@@ -1,14 +1,11 @@
-# Jira clone API built with Node/TypeScript
+# Project structure
 
 The API codebase is fairly simple and should be easy enough to understand.
 
-### Project structure
-
 <br>
 
-<!-- prettier-ignore-start -->
 | File or folder    | Description                                                                                                                                                                                                                 |
-| --------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| ----------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
 | `src/index.ts`    | The entry file. This is where we setup middleware, attach routes, initialize database and express.                                                                                                                          |
 | `src/routes.ts`   | This is where we define all routes, both public and private.                                                                                                                                                                |
 | `src/constants`   | Constants are values that never change and are used in multiple places across the codebase.                                                                                                                                 |
@@ -19,7 +16,6 @@ The API codebase is fairly simple and should be easy enough to understand.
 | `src/middleware`  | Middleware functions can modify request and response objects, end the request-response cycle, etc. For example `authenticateUser` method verifies the authorization token and attaches `currentUser` to the request object. |
 | `src/serializers` | Serializers transform the data fetched from the database before it's sent to the client.                                                                                                                                    |
 | `src/utils`       | Utility(helper) functions that are used in multiple places across the codebase. For example `utils/typeorm.ts` functions help us validate data and avoid writing repetitive code.                                           |
-<!-- prettier-ignore-end -->
 
 <br>
 

api/src/index.ts

@@ -22,7 +22,6 @@ const establishDatabaseConnection = async (): Promise<void> => {
 
 const initializeExpress = (): void => {
   const app = express();
-  const PORT = 3000;
 
   app.use(cors());
   app.use(express.json());
@@ -39,7 +38,7 @@ const initializeExpress = (): void => {
   app.use((req, _res, next) => next(new RouteNotFoundError(req.originalUrl)));
   app.use(handleError);
 
-  app.listen(PORT, () => console.log(`App listening on port ${PORT}`));
+  app.listen(process.env.PORT || 3000);
 };
 
 const initializeApp = async (): Promise<void> => {

client/server.js

@@ -2,8 +2,6 @@ const express = require('express');
 const fallback = require('express-history-api-fallback');
 const compression = require('compression');
 
-const PORT = process.env.$PORT || process.env.PORT || 8080;
-
 const app = express();
 
 app.use(compression());
@@ -12,4 +10,4 @@ app.use(express.static(`${__dirname}/build`));
 
 app.use(fallback(`${__dirname}/build/index.html`));
 
-app.listen(PORT);
+app.listen(process.env.PORT || 8080);

client/src/shared/hooks/api/query.js

@@ -23,10 +23,12 @@ const useQuery = (url, propsVariables = {}, options = {}) => {
   });
 
   const makeRequest = useCallback(
-    (newVariables, { skipLoading } = {}) => {
+    newVariables => {
       const variables = { ...state.variables, ...(newVariables || {}) };
       const apiVariables = { ...propsVariablesMemoized, ...variables };
 
+      const skipLoading = canUseCache && cachePolicy === 'cache-first';
+
       if (!skipLoading) {
         mergeState({ isLoading: true, variables });
       } else if (newVariables) {
@@ -53,20 +55,16 @@ const useQuery = (url, propsVariables = {}, options = {}) => {
     if (isSleeping) return;
     if (canUseCache && cachePolicy === 'cache-only') return;
 
-    makeRequest(
-      {},
-      {
-        skipLoading: canUseCache && cachePolicy === 'cache-first',
-      },
-    );
+    makeRequest();
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [makeRequest]);
 
   const setLocalData = useCallback(
     getUpdatedData =>
       mergeState(({ data }) => {
-        cache[url] = { ...(cache[url] || {}), data: getUpdatedData(data) };
-        return { data: getUpdatedData(data) };
+        const updatedData = getUpdatedData(data);
+        cache[url] = { ...(cache[url] || {}), data: updatedData };
+        return { data: updatedData };
       }),
     [mergeState, url],
   );

client/src/shared/utils/api.js

@@ -6,7 +6,7 @@ import { objectToQueryString } from 'shared/utils/url';
 import { getStoredAuthToken, removeStoredAuthToken } from 'shared/utils/authToken';
 
 const defaults = {
-  baseURL: 'http://localhost:3000',
+  baseURL: `http://localhost:${process.env.PORT || 3000}`,
   headers: () => ({
     'Content-Type': 'application/json',
     Authorization: getStoredAuthToken() ? `Bearer ${getStoredAuthToken()}` : undefined,