mirror of
https://github.com/AmruthPillai/Reactive-Resume.git
synced 2025-11-15 01:01:43 +10:00
GitBook: [#2] No subject
This commit is contained in:
committed by
gitbook-bot
parent
1996d1b30b
commit
5604ca982d
34
source-code/docker.md
Normal file
34
source-code/docker.md
Normal 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
|
||||
```
|
||||
171
source-code/environment-variables.md
Normal file
171
source-code/environment-variables.md
Normal 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`
|
||||
12
source-code/introduction.md
Normal file
12
source-code/introduction.md
Normal 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)
|
||||
56
source-code/local-build.md
Normal file
56
source-code/local-build.md
Normal 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
|
||||
```
|
||||
|
||||

|
||||
|
||||
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).
|
||||
Reference in New Issue
Block a user