diff --git a/.dockerignore b/.dockerignore new file mode 100644 index 0000000..fd3dbb5 --- /dev/null +++ b/.dockerignore @@ -0,0 +1,36 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +# dependencies +/node_modules +/.pnp +.pnp.js +.yarn/install-state.gz + +# testing +/coverage + +# next.js +/.next/ +/out/ + +# production +/build + +# misc +.DS_Store +*.pem + +# debug +npm-debug.log* +yarn-debug.log* +yarn-error.log* + +# local env files +.env*.local + +# vercel +.vercel + +# typescript +*.tsbuildinfo +next-env.d.ts diff --git a/Dockerfile b/Dockerfile new file mode 100644 index 0000000..739aba3 --- /dev/null +++ b/Dockerfile @@ -0,0 +1,45 @@ +# syntax = docker/dockerfile:1 + +# Adjust NODE_VERSION as desired +ARG NODE_VERSION=22.3.0 +FROM node:${NODE_VERSION}-slim as base + +LABEL fly_launch_runtime="Next.js" + +# Next.js app lives here +WORKDIR /app + +# Set production environment +ENV NODE_ENV="production" + + +# Throw-away build stage to reduce size of final image +FROM base as build + +# Install packages needed to build node modules +RUN apt-get update -qq && \ + apt-get install --no-install-recommends -y build-essential node-gyp pkg-config python-is-python3 + +# Install node modules +COPY --link package-lock.json package.json ./ +RUN npm ci --include=dev + +# Copy application code +COPY --link . . + +# Build application +RUN npm run build + +# Remove development dependencies +RUN npm prune --omit=dev + + +# Final stage for app image +FROM base + +# Copy built application +COPY --from=build /app /app + +# Start the server by default, this can be overwritten at runtime +EXPOSE 3000 +CMD [ "npm", "run", "start" ] diff --git a/app/about/page.jsx b/app/about/page.jsx new file mode 100644 index 0000000..f56aa6d --- /dev/null +++ b/app/about/page.jsx @@ -0,0 +1,103 @@ +import React from 'react'; +import { User, Award, Globe } from 'lucide-react'; +import { Button } from '@/components/ui/Button'; + +const TeamMember = ({ name, role, image }) => ( +
+ {name} +
+

{name}

+

{role}

+
+
+); + +const AboutPage = () => { + const teamMembers = [ + { name: "Jane Doe", role: "CEO & Founder", image: "/api/placeholder/150/150" }, + { name: "John Smith", role: "CTO", image: "/api/placeholder/150/150" }, + { name: "Emily Brown", role: "Head of AI", image: "/api/placeholder/150/150" }, + ]; + + return ( +
+
+
+

About Us

+
+
+
+
+
+
+

+ Empowering Canadian Businesses with Innovative Technology +

+

+ Techaro Computing Canada is at the forefront of digital transformation, helping businesses across the country leverage cutting-edge technology to drive growth and innovation. +

+
+ +
+
+

Our Mission

+
+
+
+
+
+ + Client Focus +
+
+ We are dedicated to understanding and meeting the unique needs of each client, ensuring their success in the digital landscape. +
+
+
+
+ + Innovation +
+
+ We continuously explore and implement the latest technologies to provide cutting-edge solutions for our clients. +
+
+
+
+ + Canadian Focus +
+
+ We are committed to strengthening the Canadian tech ecosystem and helping local businesses compete on a global scale. +
+
+
+
+
+ +
+

Our Leadership Team

+
+ {teamMembers.map((member, index) => ( + + ))} +
+
+ +
+
+

Ready to Transform Your Business?

+

Let{"'"}s discuss how Techaro Computing Canada can help you achieve your technology goals.

+ +
+
+
+
+
+
+ ); +}; + +export default AboutPage; \ No newline at end of file diff --git a/app/contact/page.jsx b/app/contact/page.jsx new file mode 100644 index 0000000..0d38a6e --- /dev/null +++ b/app/contact/page.jsx @@ -0,0 +1,52 @@ +import React from 'react'; + +const ContactPage = () => { + async function contactForm(formData) { + "use server"; + const rawFormData = { + name: formData.get('name'), + email: formData.get('email'), + message: formData.get('message'), + }; + console.log(rawFormData); + }; + + return ( +
+

Contact Techaro Computing Canada

+ +
+
+

Get in Touch

+

We would love to hear from you. Please fill out the form below or use our contact information.

+ +

Contact Information

+

Email: sales@techaro.lol

+

Phone: (123) 456-7890

+

Address: 123 Tech Street, Toronto, ON M5V 1J2

+
+ +
+

Contact Form

+
+
+ + +
+
+ + +
+
+ + +
+ +
+
+
+
+ ); +}; + +export default ContactPage; \ No newline at end of file diff --git a/app/globals.css b/app/globals.css index 875c01e..152ba88 100644 --- a/app/globals.css +++ b/app/globals.css @@ -2,6 +2,14 @@ @tailwind components; @tailwind utilities; +html { + font-family: var(--font-inter); +} + +h1 { + font-family: var(--font-podkova); +} + :root { --foreground-rgb: 0, 0, 0; --background-start-rgb: 214, 219, 220; diff --git a/app/layout.tsx b/app/layout.tsx index 3314e47..b8ab185 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -1,12 +1,25 @@ import type { Metadata } from "next"; -import { Inter } from "next/font/google"; +import { Inter, Podkova } from "next/font/google"; import "./globals.css"; +import React from "react"; +import Link from "next/link"; +import { Button } from "@/components/ui/Button"; -const inter = Inter({ subsets: ["latin"] }); +const inter = Inter({ + subsets: ["latin"], + variable: "--font-inter", + display: "swap", +}); + +const podkova = Podkova({ + subsets: ["latin"], + variable: "--font-podkova", + display: "swap", +}); export const metadata: Metadata = { - title: "Create Next App", - description: "Generated by create next app", + title: "Techaro Computing Canada", + description: "Your one-stop shop for all your computing needs.", }; export default function RootLayout({ @@ -16,7 +29,69 @@ export default function RootLayout({ }>) { return ( - {children} + +
+
+ +
+
{children}
+ +
+ ); } diff --git a/app/page.jsx b/app/page.jsx new file mode 100644 index 0000000..fc1a244 --- /dev/null +++ b/app/page.jsx @@ -0,0 +1,91 @@ +import React from 'react'; +import Link from 'next/link'; +import { ChevronRight, Laptop, Users, TrendingUp, Brain } from 'lucide-react'; +import { Button } from '@/components/ui/Button'; + +const HomePage = () => { + return ( +
+
+
+

+ Transform Your Business + with Techaro Computing Canada +

+

+ We help Canadian businesses leverage cutting-edge technology to drive growth, efficiency, and innovation. +

+
+
+ + + +
+
+ + + +
+
+
+
+ +
+

Our Services

+
+ {[ + { icon: Laptop, title: "IT Strategy", description: "Align your technology investments with your business goals for maximum impact." }, + { icon: Users, title: "Digital Transformation", description: "Modernize your operations and customer experiences with cutting-edge digital solutions." }, + { icon: TrendingUp, title: "Data Analytics", description: "Unlock the power of your data to drive informed decision-making and business growth." } + ].map((service, index) => ( +
+
+
+
+ + + +
+

{service.title}

+

{service.description}

+
+
+
+ ))} +
+
+ +
+
+
+

+ Transform Your Business + with Industry-Leading AI Tools +

+

+ At Techaro Computing Canada, we offer transformational experiences by leveraging cutting-edge AI technologies. Our solutions empower your business to stay ahead in the rapidly evolving digital landscape. +

+ + + +
+
+
+
+ +
+
+
+
+
+ ); +}; + +export default HomePage; \ No newline at end of file diff --git a/app/page.tsx b/app/page.tsx deleted file mode 100644 index 5705d4e..0000000 --- a/app/page.tsx +++ /dev/null @@ -1,113 +0,0 @@ -import Image from "next/image"; - -export default function Home() { - return ( -
-
-

- Get started by editing  - app/page.tsx -

-
- - By{" "} - Vercel Logo - -
-
- -
- Next.js Logo -
- -
- -

- Docs{" "} - - -> - -

-

- Find in-depth information about Next.js features and API. -

- - - -

- Learn{" "} - - -> - -

-

- Learn about Next.js in an interactive course with quizzes! -

- - - -

- Templates{" "} - - -> - -

-

- Explore starter templates for Next.js. -

- - - -

- Deploy{" "} - - -> - -

-

- Instantly deploy your Next.js site to a shareable URL with Vercel. -

- -
-
- ); -} diff --git a/app/services/page.jsx b/app/services/page.jsx new file mode 100644 index 0000000..f6d1d29 --- /dev/null +++ b/app/services/page.jsx @@ -0,0 +1,85 @@ +import React from 'react'; +import Link from 'next/link'; +import { Cpu, Database, Cloud, Shield, Users, TrendingUp } from 'lucide-react'; +import { Button } from '@/components/ui/Button'; + +const ServiceCard = ({ icon: Icon, title, description }) => ( +
+
+ +

{title}

+

{description}

+
+
+); + +const ServicesPage = () => { + const services = [ + { + icon: Cpu, + title: "AI and Machine Learning", + description: "Leverage cutting-edge AI technologies to automate processes, gain insights, and drive innovation in your business." + }, + { + icon: Database, + title: "Data Analytics", + description: "Transform your raw data into actionable insights with our advanced analytics solutions." + }, + { + icon: Cloud, + title: "Cloud Migration", + description: "Seamlessly transition your infrastructure and applications to the cloud for improved scalability and efficiency." + }, + { + icon: Shield, + title: "Cybersecurity", + description: "Protect your digital assets with our comprehensive cybersecurity services and solutions." + }, + { + icon: Users, + title: "Digital Transformation", + description: "Modernize your business processes and customer experiences with our digital transformation strategies." + }, + { + icon: TrendingUp, + title: "IT Strategy Consulting", + description: "Align your technology investments with your business goals to maximize ROI and drive growth." + } + ]; + + return ( +
+
+
+

Our Services

+
+
+
+
+
+

+ Comprehensive IT Solutions for Canadian Businesses +

+

+ At Techaro Computing Canada, we offer a wide range of services to help your business thrive in the digital age. +

+
+
+ {services.map((service, index) => ( + + ))} +
+
+ + + +
+
+
+
+ ); +}; + +export default ServicesPage; \ No newline at end of file diff --git a/components/ui/Button.tsx b/components/ui/Button.tsx new file mode 100644 index 0000000..cc8b253 --- /dev/null +++ b/components/ui/Button.tsx @@ -0,0 +1,49 @@ +import React from "react"; +import { cn } from "@/lib/utils"; + +const buttonVariants = { + base: "inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:opacity-50 disabled:pointer-events-none", + variant: { + default: "bg-primary text-primary-foreground hover:bg-primary/90", + destructive: + "bg-destructive text-destructive-foreground hover:bg-destructive/90", + outline: + "border border-input bg-background hover:bg-accent hover:text-accent-foreground", + secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80", + ghost: "hover:bg-accent hover:text-accent-foreground", + link: "text-primary underline-offset-4 hover:underline", + }, + size: { + default: "h-10 px-4 py-2", + sm: "h-9 rounded-md px-3", + lg: "h-11 rounded-md px-8", + icon: "h-10 w-10", + }, +}; + +export interface ButtonProps + extends React.ButtonHTMLAttributes { + variant?: keyof typeof buttonVariants.variant; + size?: keyof typeof buttonVariants.size; +} + +const Button = React.forwardRef( + ({ className, variant = "default", size = "default", ...props }, ref) => { + return ( +