diff --git a/.dockerignore b/.dockerignore
new file mode 100644
index 0000000..fd00eaa
--- /dev/null
+++ b/.dockerignore
@@ -0,0 +1,34 @@
+# Include any files or directories that you don't want to be copied to your
+# container here (e.g., local build artifacts, temporary files, etc.).
+#
+# For more help, visit the .dockerignore file reference guide at
+# https://docs.docker.com/go/build-context-dockerignore/
+
+**/.classpath
+**/.dockerignore
+**/.env
+**/.git
+**/.gitignore
+**/.project
+**/.settings
+**/.toolstarget
+**/.vs
+**/.vscode
+**/.next
+**/.cache
+**/*.*proj.user
+**/*.dbmdl
+**/*.jfm
+**/charts
+**/docker-compose*
+**/compose*
+**/Dockerfile*
+**/node_modules
+**/npm-debug.log
+**/obj
+**/secrets.dev.yaml
+**/values.dev.yaml
+**/build
+**/dist
+LICENSE
+README.md
diff --git a/Dockerfile b/Dockerfile
new file mode 100644
index 0000000..c5a8a5d
--- /dev/null
+++ b/Dockerfile
@@ -0,0 +1,70 @@
+# syntax=docker/dockerfile:1
+
+# Comments are provided throughout this file to help you get started.
+# If you need more help, visit the Dockerfile reference guide at
+# https://docs.docker.com/go/dockerfile-reference/
+
+ARG NODE_VERSION=21.6.2
+
+################################################################################
+# Use node image for base image for all stages.
+FROM node:${NODE_VERSION}-alpine as base
+
+# Set working directory for all build stages.
+WORKDIR /usr/src/app
+
+
+################################################################################
+# Create a stage for installing production dependecies.
+FROM base as deps
+
+# Download dependencies as a separate step to take advantage of Docker's caching.
+# Leverage a cache mount to /root/.npm to speed up subsequent builds.
+# Leverage bind mounts to package.json and package-lock.json to avoid having to copy them
+# into this layer.
+RUN --mount=type=bind,source=package.json,target=package.json \
+ --mount=type=bind,source=package-lock.json,target=package-lock.json \
+ --mount=type=cache,target=/root/.npm \
+ npm ci --omit=dev
+
+################################################################################
+# Create a stage for building the application.
+FROM deps as build
+
+# Download additional development dependencies before building, as some projects require
+# "devDependencies" to be installed to build. If you don't need this, remove this step.
+RUN --mount=type=bind,source=package.json,target=package.json \
+ --mount=type=bind,source=package-lock.json,target=package-lock.json \
+ --mount=type=cache,target=/root/.npm \
+ npm ci
+
+# Copy the rest of the source files into the image.
+COPY . .
+# Run the build script.
+RUN npm run build
+
+################################################################################
+# Create a new stage to run the application with minimal runtime dependencies
+# where the necessary files are copied from the build stage.
+FROM base as final
+
+# Use production node environment by default.
+ENV NODE_ENV production
+
+# Run the application as a non-root user.
+USER node
+
+# Copy package.json so that package manager commands can be used.
+COPY package.json .
+
+# Copy the production dependencies from the deps stage and also
+# the built application from the build stage into the image.
+COPY --from=deps /node_modules ./node_modules
+COPY --from=build /prod ./prod
+
+
+# Expose the port that the application listens on.
+EXPOSE 3000
+
+# Run the application.
+CMD npm start
diff --git a/README.Docker.md b/README.Docker.md
new file mode 100644
index 0000000..5a7ae36
--- /dev/null
+++ b/README.Docker.md
@@ -0,0 +1,22 @@
+### Building and running your application
+
+When you're ready, start your application by running:
+`docker compose up --build`.
+
+Your application will be available at http://localhost:8080.
+
+### Deploying your application to the cloud
+
+First, build your image, e.g.: `docker build -t myapp .`.
+If your cloud uses a different CPU architecture than your development
+machine (e.g., you are on a Mac M1 and your cloud provider is amd64),
+you'll want to build the image for that platform, e.g.:
+`docker build --platform=linux/amd64 -t myapp .`.
+
+Then, push it to your registry, e.g. `docker push myregistry.com/myapp`.
+
+Consult Docker's [getting started](https://docs.docker.com/go/get-started-sharing/)
+docs for more detail on building and pushing.
+
+### References
+* [Docker's Node.js guide](https://docs.docker.com/language/nodejs/)
\ No newline at end of file
diff --git a/compose.yaml b/compose.yaml
new file mode 100644
index 0000000..1a03820
--- /dev/null
+++ b/compose.yaml
@@ -0,0 +1,51 @@
+# Comments are provided throughout this file to help you get started.
+# If you need more help, visit the Docker compose reference guide at
+# https://docs.docker.com/go/compose-spec-reference/
+
+# Here the instructions define your application as a service called "server".
+# This service is built from the Dockerfile in the current directory.
+# You can add other services your application may depend on here, such as a
+# database or a cache. For examples, see the Awesome Compose repository:
+# https://github.com/docker/awesome-compose
+services:
+ server:
+ build:
+ context: .
+ environment:
+ NODE_ENV: production
+ ports:
+ - 8080:8080
+
+# The commented out section below is an example of how to define a PostgreSQL
+# database that your application can use. `depends_on` tells Docker Compose to
+# start the database before your application. The `db-data` volume persists the
+# database data between container restarts. The `db-password` secret is used
+# to set the database password. You must create `db/password.txt` and add
+# a password of your choosing to it before running `docker-compose up`.
+# depends_on:
+# db:
+# condition: service_healthy
+# db:
+# image: postgres
+# restart: always
+# user: postgres
+# secrets:
+# - db-password
+# volumes:
+# - db-data:/var/lib/postgresql/data
+# environment:
+# - POSTGRES_DB=example
+# - POSTGRES_PASSWORD_FILE=/run/secrets/db-password
+# expose:
+# - 5432
+# healthcheck:
+# test: [ "CMD", "pg_isready" ]
+# interval: 10s
+# timeout: 5s
+# retries: 5
+# volumes:
+# db-data:
+# secrets:
+# db-password:
+# file: db/password.txt
+
diff --git a/src/App.js b/src/App.js
index 640e794..7b55c94 100644
--- a/src/App.js
+++ b/src/App.js
@@ -15,6 +15,8 @@ import 'firebase/compat/auth';
import {useAuthState} from 'react-firebase-hooks/auth';
import {useCollectionData} from 'react-firebase-hooks/firestore';
+import Settings from './components/Settings';
+
firebase.initializeApp({
apiKey: "AIzaSyDhXnMyDGw3ei7-4M-x1LXcEZvATPx0tbc",
authDomain: "yapper-204ab.firebaseapp.com",
@@ -30,6 +32,8 @@ const firestore =firebase.firestore();
+
+
function App() {
const [user] = useAuthState(auth);
diff --git a/src/components/Settings.jsx b/src/components/Settings.jsx
new file mode 100644
index 0000000..983e327
--- /dev/null
+++ b/src/components/Settings.jsx
@@ -0,0 +1,35 @@
+import { useState } from "react";
+
+export default function Settings() {
+ let [userSettings, setUserSettings] = useState({});
+
+ let handleChange = (e) => {
+ let name = e.target.name;
+ let value = e.target.value;
+ setUserSettings({ ...userSettings, [name]: value });
+ }
+
+ let handleSubmit = (e) => {
+ e.preventDefault();
+ console.log(userSettings);
+ }
+
+
+ return (
+
+
Settings
+
+
Sample Text
+