Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/saddamarbaa/google-clone-app-nex-js-typescript

==> Building Google Clone App with React Js + Next.js 13 + TypeScript + Tailwind CSS + next-auth + Dark Mode + Vercel Hosting (a mobile-friendly)
https://github.com/saddamarbaa/google-clone-app-nex-js-typescript

google-api nextjs react react-server-components tailwindcss typescript vercel

Last synced: 2 months ago
JSON representation

==> Building Google Clone App with React Js + Next.js 13 + TypeScript + Tailwind CSS + next-auth + Dark Mode + Vercel Hosting (a mobile-friendly)

Host: GitHub
URL: https://github.com/saddamarbaa/google-clone-app-nex-js-typescript
Owner: saddamarbaa
License: mit
Created: 2021-10-07T17:00:13.000Z (about 3 years ago)
Default Branch: main
Last Pushed: 2024-02-17T13:06:36.000Z (10 months ago)
Last Synced: 2024-10-02T16:20:57.266Z (3 months ago)
Topics: google-api, nextjs, react, react-server-components, tailwindcss, typescript, vercel
Language: TypeScript
Homepage: https://google-clone-app-nex-js.vercel.app/
Size: 801 KB
Stars: 5
Watchers: 2
Forks: 1
Open Issues: 0
Metadata Files:
- Readme: README.md
- License: LICENSE

Awesome Lists containing this project

README

# Google Clone

Building Google Clone App with React Js, Next Js, TypeScript, Tailwind CSS,
NextAuth, React Icons, Vercel Hosting (mobile-friendly).

# Table of contents

- [Author](#Author)
- [Technologies](#Technologies)
- [Optimizations](#Optimizations)
- [Contributing](#Contributing)
- [Status](#status)
- [Features](#Features)
- [Inspiration](#inspiration)
- [Related Projects](#Related_Projects)
- [Support](#Support)
- [Feedback](#Feedback)
- [Run Locally](#Run_Locally)
- [Environment Variables](#Environment)
- [Screenshots](#Screenshots)

# Author

### @Saddam Arbaa

# Technologies

- React Js
- Next Js
- TypeScript
- Tailwind CSS
- NextAuth
- React Icons

# Features

- Google Sign-In
- Github Sign-In
- Search for web and Images using Google API
- Pagination
- Loading Skeleton

# Demo

## LIVE DEMO

# Optimizations

- Next Js Image component
- Next Js file-system based routing
- Next Js Server-side rendering
- TypeScript
- Vercel Hosting
- React Server Components

# Contributing

Contributions are always welcome!

# Support

For support, email [email protected].

# Feedback

If you have any feedback, please reach out to me at [email protected]

Twitter
https://twitter.com/ArbaaSaddam/

Linkedin.
https://www.linkedin.com/in/saddamarbaa/

Github
https://github.com/saddamarbaa

Instagram
https://www.instagram.com/saddam.dev/

Facebook
https://www.facebook.com/saddam.arbaa

# Run_Locally

Clone the project

```bash
https://github.com/saddamarbaa/google-clone-app-nex-js-typescript
```

Go to the project directory

```bash
cd google-clone-app-nex-js-typescript
```

Install dependencies

```bash
npm install
```

Start the server

```bash
npm run dev
# or
yarn dev
```

# Environment

- To run this project, you will need the following environment variables to your .env.local

- FIREBASE_GOOGLE_WEB_CLIENT_ID
- FIREBASE_GOOGLE_WEB_CLIENT_SECRET
- NEXT_AUTH_SECRET
- NEXT_AUTH_URL
- GOOGLE_API_KEY
- GOOGLE_CONTEXT_KEY
- GITHUB_ID
- GITHUB_SECRET

get google API key from the following link
https://console.cloud.google.com/apis/dashboard

get google Context key from the following link
https://cse.google.com/create/new

# Status

Project is now complete in (React + TypeScript + Next.js) so my next step I would love to converted to (React + TypeScript + Next.js + Node.js + Express + MongoDB)

# Inspiration

Build By Saddam Arbaa Project inspired by [Google] https://www.google.com/

# Related_Projects

### Realtor Clone App built with React Js + TypeScript + Tailwind CSS + Vercel Hosting + Firebase