GitBook: [#2] No subject

This commit is contained in:
Amruth Pillai
2022-08-28 08:20:02 +00:00
committed by gitbook-bot
parent 1996d1b30b
commit 5604ca982d
16 changed files with 394 additions and 3 deletions

34
source-code/docker.md Normal file
View File

@ -0,0 +1,34 @@
# Docker
This is probably the easiest method to build the source code on your machine if you already have Docker and Docker Compose installed. If you don't have Docker on your machine, I'll let you figure that out on your own.
1. Once you have Docker set up, you can pull the source code from GitHub and dive into the repository.
```bash
git clone git@github.com:AmruthPillai/Reactive-Resume.git
cd Reactive-Resume
```
1. Install dependencies using [pnpm](https://pnpm.io/), but feel free to use any other package manager that supports [npm workspaces](https://docs.npmjs.com/cli/v8/using-npm/workspaces).
```bash
pnpm install
```
1. Copy the `.env.example` file to `.env` in the project root and fill it with values according to your setup. To know which environment variables are required, and about what they do, head over this section.
```bash
cp .env.example .env
```
1. Use Docker Compose to create a PostgreSQL instance and a `reactive_resume` database, or feel free to use your own and modify the variables used in `.env`
```bash
docker-compose up -d postgres
```
1. Run the project and start building!
```bash
pnpm dev
```

View File

@ -0,0 +1,171 @@
# Environment Variables
## Environment Variables
The project source code requires certain envrionment variables to be pre-set in order to work as expected. You can get a copy of what the `.env` file should look like from the `.env.example` file in the root of the project's [source code](https://github.com/AmruthPillai/Reactive-Resume/blob/main/.env.example).
Here, I'll be explaining what each of the environment variables are for, and which ones are actually **required** and which ones aren't.
### App
#### `TZ`
**Required**: `no`\
**Default Value:** `UTC`\
**Description:** Server Timezone
This field is just to indicate the timezone that the server should follow. This is just so that the date time information should be unified and all timestamps should follow the same suit.
#### `SECRET_KEY`
**Required**: `yes`\
**Description:** Secret Key for Client-Server Communication
The secret key can be a unique key, a randomly generated string that is used for client-server communication. You can use this [random.org](https://www.random.org/strings/?num=10\&len=20\&digits=on\&upperalpha=on\&loweralpha=on\&unique=on\&format=html\&rnd=new) configuration to generate a long unique string.
### URLs
#### `PUBLIC_URL`
**Required**: `yes`\
**Description:** URL through which app is accessible
**Default Value:** `http://localhost`
This URL would be used in features like link sharing functionality and authentication redirection. This points only to the client app, as the server would be running on `PORT 3100` always.
#### `PUBLIC_SERVER_URL`
**Required**: `yes`\
**Description:** URL through which server is accessible
**Default Value:** `http://localhost/api`
This URL is used when export PDF functionality is used within the app and has to reach out to the server.
### Database
#### `POSTGRES_HOST`
**Required**: `yes`\
**Default Value:** `localhost`\
**Description:** Hostname for the PostgreSQL Server
#### `POSTGRES_PORT`
**Required**: `yes`\
**Default Value:** `5432`\
**Description:** Port of the PostgreSQL Server
#### `POSTGRES_DB`
**Required**: `yes`\
**Default Value:** `postgres`\
**Description:** Name of the Database in PostgreSQL Server
#### `POSTGRES_USER`
**Required**: `yes`\
**Default Value:** `postgres`\
**Description:** Username of the PostgreSQL Server
#### `POSTGRES_PASSWORD`
**Required**: `yes`\
**Default Value:** `postgres`\
**Description:** Password of the PostgreSQL Server
#### `POSTGRES_SSL_CERT`
**Required**: `no`\
**Description:** Base64 Encoded String of the SSL CA Certificate
Some production-grade managed databases require the need to pass a CA certificate along with the options. You can encode the contents of the `.crt` file sent to you by your cloud provider in _Base64_ and provide it as a environment variable.
### Authentication
#### `JWT_SECRET`
**Required**: `yes`\
**Description:** Secret to Sign and Extract JWT Payloads
Similar to the `SECRET_KEY`, this can also be a unique generated string. This is used for email/password authentication, to hash + salt passwords stored in the database so they are unreadable.
#### `JWT_EXPIRY_TIME`
**Required**: `yes`\
**Default Value:** `604800`\
**Description:** How long should the JWT be valid for?
This value, in milliseconds, denotes the validity of the JWT token. A shorter value would make the user have to login more frequently.
### Google
As much as I'd like to keep Google out of the picture, they do provide a few services that are actually useful. Namely, Google OAuth (for Login with Google) and Google Fonts (to list all fonts and use them on a resume).
#### `PUBLIC_GOOGLE_CLIENT_ID`
**Required**: `no`\
**Description:** Google Client ID for Google Login
This field is only required if the Google Login functionality is important to you.
#### `GOOGLE_CLIENT_SECRET`
**Required**: `no`\
**Description:** Google Client Secret for Google Login
This field is only required if the Google Login functionality is important to you.
#### `GOOGLE_API_KEY`
**Required**: `no`\
**Description:** Google API Key used for fetching Google Fonts
Within the resume builder, there's a section where you can pick any font from the Google Fonts Library. To fetch the names and IDs of these fonts, we depend on the Google Fonts API. It does not cost any payment, or the need to enter credit card information to create or use this API.
You can get your own key here: https://developers.google.com/fonts/docs/developer\_api
If you do not have a Google API Key, it was make use of the cached response JSON that's stored within the project source. Please note that this cache is not updated and may not have all the latest fonts that Google Fonts has to offer.
### Mail
The server makes use of SMTP to send the password reset email to those who have forgotten their password. **This section is completely optional for those who do not require this functionality.**
#### `MAIL_FROM_NAME`
**Required**: `no`\
**Description:** Sender's Name
#### `MAIL_FROM_EMAIL`
**Required**: `no`\
**Description:** Sender's Email Address
### Storage
You can either use S3 or any S3-compliant service such as DigitalOcean Spaces to store profile pictures uploaded by users of the platform.
#### `STORAGE_BUCKET`
**Required**: `yes`
#### `STORAGE_REGION`
**Required**: `yes`
#### `STORAGE_ENDPOINT`
**Required**: `yes`
#### `STORAGE_URL_PREFIX`
**Required**: `yes`
#### `STORAGE_ACCESS_KEY`
**Required**: `yes`
#### `STORAGE_SECRET_KEY`
**Required**: `yes`

View File

@ -0,0 +1,12 @@
# Introduction
No, I'm not going to be talking about [the 2011 movie](https://www.imdb.com/title/tt0945513/) here.
The source code to Reactive Resume is available on [GitHub](https://github.com/AmruthPillai) for you to poke, prod, pull and publish. It is distributed under the [MIT License](https://choosealicense.com/licenses/mit/) which allows you to do **anything you want** with it, including commercial use.
In this section, I'll be going through the steps on how you can build the project on your local machine (or the cloud). You can choose one of two paths from here:
* [Docker](docker.md)
* [Local Build](local-build.md)

View File

@ -0,0 +1,56 @@
# Local Build
This might not be the most versatile, but it's quite easy and my recommended way of getting the project set up. This project is heavily dependent on [pnpm](https://pnpm.io) and it's monorepo workspaces feature, so I'd pick that up if I were you.
1. Once you have `pnpm` set up, you can pull the source code from GitHub and dive into the repository.
```bash
git clone git@github.com:AmruthPillai/Reactive-Resume.git
cd Reactive-Resume
```
1. Install dependencies using [pnpm](https://pnpm.io/), and it should take just a few minutes.
```bash
pnpm install
```
1. Copy the `.env.example` file to `.env` in the project root and fill it with values according to your setup. To know which environment variables are required, and about what they do, head over this section.
```bash
cp .env.example .env
```
1. Run the app locally by using the command:
```bash
pnpm dev
```
Now, your **frontend** client should be running on [`http://localhost:3000`](http://localhost:3000), your **backend** server on [`http://localhost:3100`](http://localhost:3100) and this **documentation** on [`http://localhost:3200`](http://localhost:3200).
1. To ensure that the app works currently, a proxy layer has to be made between the client and server. For this, I made use of a Chrome extension called [**Rabbit URL Rewriter**](https://chrome.google.com/webstore/detail/rabbit-url-rewriter/kcbmcmeblpkcndhfhkclggekfblookii?hl=en) to forward my requests made to `localhost:3000/api` to `localhost:3100`. The configuration should look something like this:
```
Website URL: http://localhost:3000
From URL: http://localhost:3000/api/(.*)
To URL: http://localhost:3100/$1
```
![Screenshot 2022-03-12 at 4 07 37 PM](https://user-images.githubusercontent.com/1134738/158023473-d415e696-f027-4bc7-af02-648c4a99b147.png)
Now, you should be able to create accounts, login etc.
1. Build the project before deploying by running the command:
```bash
pnpm build
```
1. Finally, start the production servers for all three workspaces by running:
```bash
pnpm start
```
Additionally, you can check the `package.json` for some additional scripts on how to run commands for a specific workspace. For more information on pnpm workspaces, head over to [their documentation](https://pnpm.io/workspaces).