Use /api instead of dedicated API subdomain (#54)

Author: EarthenSky

config/nginx.conf

@@ -1,5 +1,9 @@
 ## csss-site-frontend nginx configuration file
 
+upstream backend {
+    server unix:/var/www/gunicorn.sock fail_timeout=0;
+}
+
 server {
     server_name new.sfucsss.org;
     listen 443 ssl;
@@ -12,20 +16,34 @@ server {
     include /etc/letsencrypt/options-ssl-nginx.conf;
     ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem;
 
+    # proxy csss-site-backend
+    location /api/ {
+        # rewrite location to exclude leading /api
+        rewrite ^/api/(.*)$ /$1 break;
+
+        # proxy request through the backend
+        proxy_pass http://backend;
+        proxy_set_header Host $host;
+        proxy_set_header X-Real-IP $remote_addr;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_set_header X-Forwarded-Proto $scheme;
+    }
+
     # redirects old 2024 mountain madness requests to the new URL
     location ~ ^/events/2024/mm(/|/index.html)?$ {
 	return 301 /mountain_madness/2024/index.html;
     }
-    
-    location = / {
+
+    # any other matching path
+    location / {
     	try_files $uri $uri/ $uri/index.html =404;
     }
 }
 
 server {
     server_name new.sfucsss.org;
     listen 80;
-    
+
     if ($host = new.sfucsss.org) {
         return 301 https://$host$request_uri;
     }

src/_shared/js/helpers.js

@@ -1,4 +1,4 @@
-const CSSS_API = 'https://api.sfucsss.org';
+const CSSS_API = 'https://new.sfucsss.org/api';
 
 /**
  * Checks if a media query matches.
@@ -89,9 +89,8 @@ export function casLogin(next) {
 /** get information about the currently logged in user */
 export async function casGetUser() {
   try {
-    const response = await fetch(`${CSSS_API}/auth/check`, {
-      method: 'GET',
-      credentials: 'include' // cookies
+    const response = await fetch('/api/auth/check', {
+      method: 'GET'
     });
 
     if (!response.ok) {

src/_shared/react/VSCode/Page.js

@@ -74,7 +74,7 @@ export const Page = (props) => {
       <div
         className="bg-zinc-950 border-t border-zinc-800 flex flex-row"
         style={{
-          'grid-area': 'bottom-bar'
+          gridArea: 'bottom-bar'
         }}
       >
         <p

src/main/pages/Home.js

@@ -103,7 +103,7 @@ export const Home = () => {
             src="/static/files/main/president.jpg"
             alt="President Portrait"
             className="w-64 h-80 object-cover rounded-lg float-left mr-6 mb-4"
-            style={{ 'overflow-clip-margin': 'unset' }}
+            style={{ overflowClipMargin: 'unset' }}
           />
           <p
             className="text-lg sm:text-xl md:text-2xl leading-relaxed text-left"