diff --git a/Dockerfile.dev b/Dockerfile.dev new file mode 100644 index 0000000..5a161e8 --- /dev/null +++ b/Dockerfile.dev @@ -0,0 +1,20 @@ +# Use the official Node.js image as the base +FROM node:18-alpine + +# Set the working directory in the container +WORKDIR /app + +# Copy package.json and package-lock.json (or yarn.lock) to the working directory +COPY package*.json ./ + +# Install dependencies (including dev dependencies) +RUN npm install + +# Copy the entire project to the working directory +COPY . . + +# Expose the port your app will run on +EXPOSE 3000 + +# Set the command to start your Next.js app in development mode +CMD ["npm", "run", "dev"] \ No newline at end of file diff --git a/README.md b/README.md index 1123763..be2eed5 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,10 @@ # Surf Pintxos ### Open source Surf forecast for all Pays Basque spots + +### Running localy from Docker + +1. Clone repository to your machine +2. Build the development Docker image using `docker build -f Dockerfile.dev -t my-nextjs-app-dev .` +3. Run the development container with the volume mount: `docker run -p 3000:3000 -v $(pwd):/app my-nextjs-app-dev` +4. The container will now have access to the codebase on the host machine, and any changes made to the codebase will be reflected in the running Next.js app inside the container. diff --git a/src/app/(surfspots)/layout.tsx b/src/app/(surfspots)/layout.tsx index f5c0950..13c023a 100644 --- a/src/app/(surfspots)/layout.tsx +++ b/src/app/(surfspots)/layout.tsx @@ -10,56 +10,56 @@ import { getTidesData, getCurrentTide } from "../utils/surfUtils"; import CurrentTide from "../components/atom/CurrentTide"; export default async function FavoriteSpotsLayout({ - children, + children, }: { - children: React.ReactNode; + children: React.ReactNode; }) { - const supabase = createServerComponentClient({ cookies }); - const { - data: { user }, - } = await supabase.auth.getUser(); - const tide = await getTidesData(); - let currentTide: { tide: string; time: string } | null = - { tide: "", time: "" } || null; - if (tide) { - currentTide = getCurrentTide(tide); - } + const supabase = createServerComponentClient({ cookies }); + const { + data: { user }, + } = await supabase.auth.getUser(); + const tide = await getTidesData(); + let currentTide: { tide: string; time: string } | null = + { tide: "", time: "" } || null; + if (tide) { + currentTide = getCurrentTide(tide); + } - return ( -
-
-
-
- {user && ( - -
+
+
+
+ {user && ( + +
- Favorite -
- - )} - -
+ Favorite +
+ + )} + +
- All Pintxos -
- -
-
- - -
-
-
- {children} -
- ); + > + All Pintxos + + + +
+ + +
+ + + {children} + + ); } diff --git a/src/app/page.tsx b/src/app/page.tsx index 378abee..585115f 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -7,38 +7,38 @@ import { Database } from "./lib/database.types"; import pintxos_lg from "./components/pintxo_lg_logo.png"; import { redirect } from "next/navigation"; export default async function Home() { - const supabase = createServerComponentClient({ cookies }); - const { - data: { user }, - } = await supabase.auth.getUser(); - if (user) { - redirect("/favorite"); - } - return ( -
- surf_pintxos_logo -

- Surf Pintxos -

-

- Surf forecast for all Pays Basque spots -

- - - - or - - - -
- ); + const supabase = createServerComponentClient({ cookies }); + const { + data: { user }, + } = await supabase.auth.getUser(); + if (user) { + redirect("/favorite"); + } + return ( +
+ surf_pintxos_logo +

+ Surf Pintxos +

+

+ Surf forecast for all Pays Basque spots +

+ + + + or + + + +
+ ); }