GitBook: [#2] No subject

docs/README.md

@@ -0,0 +1,20 @@
+# Introduction
+
+## What is DevsCard?
+
+DevsCard is a fully customizable template to create your online resume without writing a single line of code. After forking the repository, you only need to update the initial data with your own and deploy the project.
+
+Apart from the website template, DevsCard offers you plenty of additional features that will make it easier to take care of your online and offline presence, including:
+
+* **✍️ Intellisense** — provide your data in TypeScript files, getting autocompletion and description of each property right in your IDE.
+* **📱 Responsiveness** — the resume is created and automatically tested to look great on mobile and desktop devices.
+* **🌠 Assets optimization** — all images in your CV are minimized and resized automatically at build time.
+* **⚡️ Performance** — get 100 for all Lighthouse metrics, ensuring a great experience for visitors and a high score for search engines.
+* **📄 PDF generation** — generate an accompanying PDF version of your CV with one command.
+* **🔶 Built-in icon sets** — choose from over 100 000 [Iconify](https://iconify.design/) icons to represent your skills.
+* **🌍 I18n** — customize your resume's locale, date formatting, and used translations.
+* **🔎 SEO friendly** — the entire website is designed with SEO in mind. All SEO-related config properties are required and well-described.
+* **🏭 Favicons generation** — invoke one command to generate all favicons and full app manifest for your website.
+* **🛠 Data helpers** — use built-in helpers to define your skills/socials once and reuse them across the configuration.
+* **🔀 Data transformers** — utilize type-safe data transformers to create multiple variants of your resume without duplicating your data.
+

docs/SUMMARY.md

@@ -0,0 +1,12 @@
+# Table of contents
+
+* [Introduction](README.md)
+* [Quick setup guide](quick-setup-guide.md)
+
+## External links
+
+* [Example resume](https://devscard.netlify.app)
+
+***
+
+* [GitHub repository](https://github.com/KonradSzwarc/devscard)

docs/quick-setup-guide.md

@@ -0,0 +1,70 @@
+# Quick setup guide
+
+## 1. Run the project locally
+
+1\. Create a fork of the [project repository](https://github.com/KonradSzwarc/devscard).
+
+<figure><img src=".gitbook/assets/CleanShot 2023-01-28 at 14.04.20@2x.png" alt=""><figcaption></figcaption></figure>
+
+2\. Go to the forked repository and clone it to your local machine.
+
+<figure><img src=".gitbook/assets/CleanShot 2023-01-28 at 14.08.09@2x.png" alt=""><figcaption></figcaption></figure>
+
+3\. Open the cloned project in your IDE of choice and run `npm install`.
+
+4\. Invoke `npm run dev` in the project's root directory and go to `http://localhost:3000`. You should see a resume website filled with initial data.
+
+## 2. Provide your data
+
+#### Basics
+
+To fill the CV with your data, go to the `src/data` directory. There you should focus on three places:
+
+* `config.ts` — use it to provide metadata of your website and set up its locales.
+* `sections` — contains files with data for each section of the resume.
+* `helpers` — helper functions you can utilize to reduce the amount of repetitiveness when setting up your socials and skills.
+  * `links.ts` — functions that ensure you always use the same icon and name when providing links to external websites. We provide the most popular socials out-of-the-box, so there is a chance you won't edit anything in this file.
+  * `skills.ts` — one place where you define your skills to reuse them in multiple sections. You can remove the skills used in the example template and replace them with your own.
+
+#### **Tips**
+
+* You can hover over each configuration property to get its description.
+  * Some property descriptions start with `[WEB]` or `[PDF]`. It means those properties are used only in the web/pdf version of the resume.
+* Although you can provide URLs for images, we highly recommend putting all images in the `src/assets` directory and importing them using the `import` statement. This way, images will be auto-optimized, so you won't have to worry about their dimensions.
+  * To know the aspect ratio of an image, hover over the `image` property.
+
+## 3. Generate PDF (optional)
+
+Within the main section, you will find an `action` property. It allows you to provide a pdf resume to download. If you don't have one, feel free to use our CV generator by invoking `npm run generate-cv`. Generated resume will be placed in `public/cv.pdf` and use the same data as the web one (without testimonials and favorites sections). To customize it, go to the \[PDF customization] docs.
+
+## 4. Deploy to Netlify
+
+{% hint style="info" %}
+As the resume is entirely static, you can deploy it to any hosting provider. In this guide, we use Netlify as it's free and easy to set up.
+{% endhint %}
+
+1\. Create a commit for your CV updates and push it to GitHub.
+
+2\. Create a [Netlify](https://www.netlify.com/) account.
+
+3\. Go to the "Sites" tab and choose "Import from Git".
+
+<figure><img src=".gitbook/assets/CleanShot 2023-01-28 at 16.16.16@2x.png" alt=""><figcaption></figcaption></figure>
+
+4\. Connect Netlify with your GitHub account.
+
+<figure><img src=".gitbook/assets/CleanShot 2023-01-28 at 16.21.01@2x.png" alt=""><figcaption></figcaption></figure>
+
+5\. Pick a repository with your forked project
+
+<figure><img src=".gitbook/assets/CleanShot 2023-01-28 at 16.22.45@2x.png" alt=""><figcaption></figcaption></figure>
+
+6\. On the last step, go with the default settings suggested by Netlify and click "Deploy site".
+
+<figure><img src=".gitbook/assets/CleanShot 2023-01-28 at 16.26.29@2x (1).png" alt=""><figcaption></figcaption></figure>
+
+7\. After around one minute, your resume will be live 🎉
+
+<figure><img src=".gitbook/assets/CleanShot 2023-01-28 at 16.28.33@2x.png" alt=""><figcaption></figcaption></figure>
+
+From now on, each push to `main` branch will cause redeploy of the Netlify website. You may want to go to the "Site settings" tab to update your site name or even [set up your domain](https://youtu.be/bY7Tkh9Vz8I).