diff --git a/.eslintrc.json b/.eslintrc.json new file mode 100644 index 0000000..4d765f2 --- /dev/null +++ b/.eslintrc.json @@ -0,0 +1,3 @@ +{ + "extends": ["next/core-web-vitals", "prettier"] +} diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..d309a4f --- /dev/null +++ b/.gitignore @@ -0,0 +1,42 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +# dependencies +/node_modules +/.pnp +.pnp.js + +# 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 +.env.development.local +.env.test.local +.env.production.local +.env + +# vercel +.vercel + +# PWA workers +**/public/workbox-*.js +**/public/sw.js +**/public/worker-*.js + +tsconfig.tsbuildinfo diff --git a/.husky/.gitignore b/.husky/.gitignore new file mode 100644 index 0000000..31354ec --- /dev/null +++ b/.husky/.gitignore @@ -0,0 +1 @@ +_ diff --git a/.husky/pre-commit b/.husky/pre-commit new file mode 100755 index 0000000..a303419 --- /dev/null +++ b/.husky/pre-commit @@ -0,0 +1,5 @@ +#!/bin/sh +. "$(dirname "$0")/_/husky.sh" + +npm run copy +npx lint-staged \ No newline at end of file diff --git a/.lintstagedrc.js b/.lintstagedrc.js new file mode 100644 index 0000000..119fde2 --- /dev/null +++ b/.lintstagedrc.js @@ -0,0 +1,12 @@ +const path = require('path'); + +const buildEslintCommand = (filenames) => + `next lint --fix --file ${filenames + .map((f) => path.relative(process.cwd(), f)) + .join(' --file ')}`; + +module.exports = { + '**/*.ts?(x)': () => 'tsc -p tsconfig.json --noEmit', + '*.{js,jsx,ts,tsx,md,html,css}': 'prettier --write', + '*.{js,jsx,ts,tsx}': [buildEslintCommand], +}; diff --git a/.npmrc b/.npmrc new file mode 100644 index 0000000..c4a4b9d --- /dev/null +++ b/.npmrc @@ -0,0 +1,3 @@ +registry=https://registry.npmjs.org +save-exact=true +public-hoist-pattern[]=*types* \ No newline at end of file diff --git a/.prettierignore b/.prettierignore new file mode 100644 index 0000000..6dc4dac --- /dev/null +++ b/.prettierignore @@ -0,0 +1,4 @@ +.next/* +.vercel/* +node_modules/* +package-lock.json diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000..e1ca468 --- /dev/null +++ b/.prettierrc @@ -0,0 +1,7 @@ +{ + "singleQuote": true, + "trailingComma": "all", + "plugins": [ + "prettier-plugin-tailwindcss" + ] +} \ No newline at end of file diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 0000000..e769a45 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,4 @@ +{ + "typescript.tsdk": "node_modules/.pnpm/typescript@4.9.4/node_modules/typescript/lib", + "typescript.enablePromptUseWorkspaceTsdk": true +} \ No newline at end of file diff --git a/CHANGELOG.md b/CHANGELOG.md new file mode 100644 index 0000000..7877ee6 --- /dev/null +++ b/CHANGELOG.md @@ -0,0 +1,261 @@ +# Changelog + +All notable changes to this project will be documented in this file. + +The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), +and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). + +## [3.0.2] - 2022-12-31 + +### Changed + +- Dependency upgrades + +## [3.0.1] - 2022-12-31 + +### Changed + +- Dependency upgrades + +## [3.0.0] - 2022-12-23 + +### Added + +- [Vercel OG Image](https://vercel.com/docs/concepts/functions/edge-functions/og-image-generation) generator integration + +### Changed + +- Newly designed web layout +- Migrated to Next.js 13 server component layouts +- Migrated to [Tailwind CSS](https://tailwindcss.com/) +- Renamed "Education" to "Achievements" to cover more general uses + +## [2.0.6] - 2022-08-04 + +### Changed + +- Dependency updates + +## [2.0.5] - 2022-08-02 + +### Changed + +- Dependency updates +- Default to `display=swap` for loading Google fonts + +## [2.0.4] - 2022-06-11 + +### Changed + +- Dependency updates + +### Removed + +- Replace `dessert-box` with custom component + +## [2.0.3] - 2022-05-13 + +### Added + +- Jest config + - Next work will be to start filling in tests + +### Changed + +- Upgrade to React 18 +- Dependency updates + +## [2.0.2] - 2022-03-21 + +### Fixed + +- `/private` now passes the `hobbies`, `links`, and `privateInformation` fields that are required by child components +- `/private` will now pass the secret key to the PDF link +- PDF generator can now receive a `secret` query param to correctly list private fields + +## [2.0.1] - 2022-02-26 + +### Added + +- Added `copyfiles` command to commit hook + +## [2.0.0] - 2022-02-26 + +### Added + +- Uses [Vanilla Extract](https://vanilla-extract.style/) for styles +- Uses custom Vanilla Extract styles and components based on an early version of the Strum Design System +- Non-PDF styles now support dark mode +- Defaults to a Markdown integration as the CMS + - Files in the project pull data for the résumé + - Requires a code change to edit the résumé +- Uses [OG Impact](https://ogimpact.sh/) to dynamically generate OG share images + +### Removed + +- Contentful and Prismic integrations are no longer supported + - With this project rewrite, we may be adding CMS integrations as extra modules over time +- No longer uses Sass or Sass modules +- No longer uses Bootstrap + +### Changed + +- Upgraded to Next.js 12.1 + - Use built-in ESLint config + - Use built-in Jest config +- Switched to [React-pdf](https://react-pdf.org/) for client-side PDF generation instead of Puppeteer for serverless PDF generation +- Switched to "Source Sans Pro" as the default font + +## [1.1.6] - 2021-12-26 + +- Upgraded to Next.js 12 + +## [1.1.5] - 2021-06-21 + +### Changed + +- Upgraded to Next.js 11 + +## [1.1.4] - 2021-05-14 + +### Changed + +- Dependency updates + +### Fixed + +- Set up Husky hooks with lint-staged to work properly with Husky 6.x + +## [1.1.3] - 2021-04-19 + +### Changed + +- Dependency updates + +## [1.1.2] - 2021-02-22 + +### Changed + +- Dependency updates + - Updated ESLint config to work with `eslint-config-prettier@8.0.0` +- Opt in to `webpack5` option in `next.config.js` + +## [1.1.1] - 2021-02-19 + +### Changed + +- Dependency updates +- Switched from `next-offline` to `next-pwa` + +### Fixed + +- Incorrect bundle analyzer config + +## [1.1.0] - 2020-12-21 + +### Added + +- Supports new optional `private_information` schema type +- Supports new optional environment variable `PRIVATE_KEY` +- New pages at `/pages/private/[secret]` and `/pages/private/[secret]/pdf` + - New pages require a `secret` slug that is compared to the `PRIVATE_KEY` value and returns a 401 on mismatch + - New pages display `private_information` values from the CMS under "Contact Information" section + - Clicking "Download PDF" button from this page also sends the secret via query to the API to validate access + +### Changed + +- Upgraded to Bootstrap 5.x beta + - Reworked many styles after the upgrade, particularly with the PDF layout +- List contact information in columns to maintain equal spacing +- Update `robots.txt` to disallow PDF layout and all private pages +- Reduced opacity delta on star ratings + +## [1.0.0] - 2020-12-19 + +### Added + +- Test configuration using Jest and Testing Library +- Snapshot tests for the index page using each CMS integration + +### Changed + +- Uses a new `NEXT_PUBLIC_CMS_INTEGRATION` env variable to determine selected integration +- Change the way that cms functions are exported to support a global integration setting + +## [0.4.2] - 2020-12-18 + +### Added + +- Correct configuration for bundle analyzer + +### Fixed + +- Use correct article adjective for job title + +## [0.4.1] - 2020-12-18 + +### Fixed + +- Missing "Hobbies & Interests" section from PDF export + +## [0.4.0] - 2020-12-18 + +### Added + +- Support for Contentful + +## [0.3.1] - 2020-12-17 + +### Fixed + +- CMS links were not being displayed on the main page footer + +### Changed + +- Dependency updates + +## [0.3.0] - 2020-12-14 + +### Added + +- Generated Open Graph and Twitter Card data in the document `
` +- The `personal_information` schema can take a `twitter_username` to include in Twitter Card data + +### Removed + +- Author's personal information from the default `manifest.json` + +## [0.2.0] - 2020-12-14 + +### Added + +- Extensive documentation for how to use the project + +### Changed + +- Revamped the PDF generator to a single-page two-column layout +- Dependency updates + +## [0.1.0] - 2020-12-04 + +### Added + +- Initial project publish +- Supports Prismic + +[unreleased]: https://github.com/colinhemphill/nextjs-resume-generator/compare/1.0.0...HEAD +[1.1.5]: https://github.com/colinhemphill/nextjs-resume-generator/tags/1.1.5 +[1.1.4]: https://github.com/colinhemphill/nextjs-resume-generator/tags/1.1.4 +[1.1.3]: https://github.com/colinhemphill/nextjs-resume-generator/tags/1.1.3 +[1.1.2]: https://github.com/colinhemphill/nextjs-resume-generator/tags/1.1.2 +[1.1.1]: https://github.com/colinhemphill/nextjs-resume-generator/tags/1.1.1 +[1.1.0]: https://github.com/colinhemphill/nextjs-resume-generator/tags/1.1.0 +[1.0.0]: https://github.com/colinhemphill/nextjs-resume-generator/tags/1.0.0 +[0.4.3]: https://github.com/colinhemphill/nextjs-resume-generator/tags/0.4.3 +[0.4.2]: https://github.com/colinhemphill/nextjs-resume-generator/tags/0.4.2 +[0.4.1]: https://github.com/colinhemphill/nextjs-resume-generator/tags/0.4.1 +[0.4.0]: https://github.com/colinhemphill/nextjs-resume-generator/tags/0.4.0 +[0.3.1]: https://github.com/colinhemphill/nextjs-resume-generator/tags/0.3.1 +[0.3.0]: https://github.com/colinhemphill/nextjs-resume-generator/tags/0.3.0 +[0.2.0]: https://github.com/colinhemphill/nextjs-resume-generator/tags/0.2.0 +[0.1.0]: https://github.com/colinhemphill/nextjs-resume-generator/tags/0.1.0 diff --git a/README-CMS.md b/README-CMS.md new file mode 100644 index 0000000..14077c2 --- /dev/null +++ b/README-CMS.md @@ -0,0 +1,78 @@ +# CMS Setup + +## Schemas + +### Personal Information + +A single Markdown file at `edit-me/cms/personal.md`. + +| Field Name | Type | Description | +| ----------------- | -------------- | ------------------------------------------ | +| `givenName` | text, required | Your first name | +| `familyName` | text, required | Your last name | +| `title` | text, required | e.g. "Full Stack Developer" | +| `location` | text, required | e.g. "Austin, TX or Remote" | +| `twitterUsername` | text, optional | Your twitter handle without the "@" symbol | + +The markdown content will be rendered as HTML to display a short description about yourself. + +### Private Information (optional) + +A series of Markdown files at `edit-me/cms/privateFields`. You can use a number prefix to order them, as the items will be displayed in the same order they are arranged in the folder. + +| Field Name | Type | Description | +| ---------- | -------------- | -------------------------------------------------------------- | +| `label` | text, required | The text label of the private field, e.g. "Email" or "Address" | + +The markdown content will be rendered as HTML to display the content of the field. Keep it short! + +### Skills + +A series of Markdown files at `edit-me/cms/skills`. You can use a number prefix to order them, as the items will be displayed in the same order they are arranged in the folder. You can add more or less than three, but you will probably need to modify the design if you plan to change this. + +| Field Name | Type | Description | +| ---------- | -------------- | ------------------------------------------------------------------------------------------------------ | +| `title` | text, required | A designator to describe the category of skills, e.g. "Soft Skills" or a strength such as "Proficient" | + +The markdown content will be rendered as HTML to display the skills for that category. We recommend a simple block of text with comma-separated skills. + +### Professional Experiences + +A series of Markdown files at `edit-me/cms/professionalExperiences`. You can use a number prefix to order them, as the items will be displayed in the same order they are arranged in the folder. + +| Field Name | Type | Description | +| -------------- | ---------------- | ------------------------------------------------------------------------------------------------------------------- | +| `title` | text, required | e.g. "Senior Software Engineer" | +| `organization` | text, required | The name of the company or organization you work for | +| `startDate` | string, required | The start date of your position, formatted in whatever way you like | +| `endDate` | string, optional | The end date of your position, formtted in whatever way you like. Leave this out if you currently hold the position | + +The markdown content will be rendered as HTML to display a description of each work experience. + +### Achievements + +A series of Markdown files at `edit-me/cms/achievements`. These are useful for degrees from a university or boot camp, certifications, etc. You can use a number prefix to order them, as the items will be displayed in the same order they are arranged in the folder. + +| Field Name | Type | Description | +| ------------- | ---------------- | --------------------------------------------------------------------------- | +| `achievement` | text, required | e.g. "B.S. in Computer Science" | +| `institution` | text, required | The name of the university, boot camp, etc. you earned the achievement from | +| `year` | number, required | The year you completed the achievement | + +The markdown content will be rendered as HTML to display a description of each achievement.. + +### Hobbies + +A single Markdown file at `edit-me/cms/hobbies.md`. + +The markdown content will be rendered as HTML to display a freeform description of your hobbies and personal interests. + +### Links + +A single TypeScript file at `edit-me/cms/links.ts` that exports an array. The array is type safe. + +| Field Name | Type | Description | +| ---------- | -------------- | --------------------------------------------------------------------------------------------------- | +| `title` | text, required | e.g. "GitHub" | +| `href` | text, required | The specific URL you wish to link to | +| `iconName` | text, required | Must match the name of a [Font Awesome brand icon](https://fontawesome.com/search?s=solid%2Cbrands) | diff --git a/README.md b/README.md new file mode 100644 index 0000000..4af4105 --- /dev/null +++ b/README.md @@ -0,0 +1,127 @@ +# Next.js and Tailwind Résumé + +A résumé built especially with software professionals in mind. Impress your potential employer with a beautiful and incredibly fast résumé website, or generate a PDF for email and print. + +[See an example](https://nextjs-resume-generator.vercel.app/) + +Your résumé can also generate a secure URL that will display information not accessible on the public URL. The secure version can include private information such as email, phone number, and mailing address. You can send the private link to a potential employer or use it to generate a more complete PDF for yourself. + +## Features + +- Update your résumé with simple Markdown files + - Integration with external headless CMS systems is possible by integrating a custom fetcher +- Beautiful and accessible web app to view your résumé, link on social media, and send to potential employers +- Generate a PDF on demand to view, download, or print +- Use a secret link to generate the résumé with additional private information +- Easily customizable + - 19 accent color palettes out-of-the-box + - 6 neutral color palettes out-of-the-box + - Automatic light and dark modes for each palette + - Tailwind styling for making it your own + - Create custom color palettes +- Dynamic OG share images in light or dark mode + +## Technology + +- [Next.js](https://nextjs.org) +- [TypeScript](https://www.typescriptlang.org/) +- [React-pdf](https://react-pdf.org/) +- [Marked](https://marked.js.org/) +- [Front Matter](https://frontmatter.codes/docs/markdown) +- [Tailwind CSS](https://tailwindcss.com/) +- [Radix UI Colors](https://www.radix-ui.com/colors) +- [Vercel OG Image Generation](https://vercel.com/docs/concepts/functions/edge-functions/og-image-generation) +- [Jest](https://jestjs.io/) +- [Testing Library](https://testing-library.com/) +- [Vercel](https://vercel.com/) + +### It's FAST + +Your résumé will use the latest Vercel technology including Next.js 13 server components and edge functions, and will load fast even on older devices and poor network conditions. + +## How To Use This Project + +The project requires only a few steps to set up your custom config, add content to the internal CMS, and deploy to Vercel! + +### Clone and Deploy + +It may seem counter-intuitive, but the simplest way to get started is to clone and deploy in one step. Afterwards, you can edit the CMS and template to match your needs. + +The project is designed to be deployed with [Vercel](https://vercel.com). By clicking the "Deploy" button below, you will clone the project to your own repository and deploy to a free HTTPS domain with Vercel's high-performance edge network. The default project will include mock data that you can edit in the next step! + +[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fcolinhemphill%2Fnextjs-resume&env=PRIVATE_KEY&envDescription=Environment%20variables%20needed%20to%20run%20the%20application%20and%20provide%20private%20information%20links&envLink=https%3A%2F%2Fgithub.com%2Fcolinhemphill%2Fnextjs-resume%23environment-variables&project-name=nextjs-resume&repo-name=nextjs-resume&demo-title=Next.js%20R%C3%A9sum%C3%A9&demo-description=An%20example%20Next.js%20static%20r%C3%A9sum%C3%A9) + +### Modify Custom Config + +Clone the project you just created to your local machine. Open it in your favorite editor, and open up the `edit-me/config/` folder at the root. Here you will find a couple of placeholder images that you can swap out if you want. You can also edit the `manifest.json` and `resumeConfig.ts` to meet your needs. The config file contains the following constants that will be used throughout the project (these are typed to provide appropriate autocomplete and error checking): + +- `accentColor`: `string`. The name of an accent palette from [Radix UI Colors](https://www.radix-ui.com/docs/colors/palette-composition/the-scales#colors). If using a standard color, the contrasting text color will be white, and if using a bright color, the contrasting text color will be black. +- `neutralColor`: `string`. The name of a neutral palette from [Radix UI Grays](https://www.radix-ui.com/docs/colors/palette-composition/the-scales#grays). +- `ogImageTheme`: `'light' | 'dark'`. Your OG share image will generate either a light or a dark variant. + +### Color Palette Examples + +The résumé generator provides 19 accent color palettes and 6 neutral color palettes out-of-the-box. Below are screenshots from a few variations in both light and dark mode. + +| Light Mode | Dark Mode | +| ----------------------------------------------------------------------------------- | --------------------------------------------------------------------------------- | +| **BLUE/MAUVE** ![Blue accent light mode](/docs/screenshots/Blue-LightMode.png) | **BLUE/MAUVE** ![Blue accent dark mode](/docs/screenshots/Blue-DarkMode.png) | +| **TOMATO/GRAY** ![Tomato accent light mode](/docs/screenshots/Tomato-LightMode.png) | **TOMATO/GRAY** ![Tomato accent dark mode](/docs/screenshots/Tomato-DarkMode.png) | +| **MINT/MAUVE** ![Mint accent light mode](/docs/screenshots/Mint-LightMode.png) | **MINT/MAUVE** ![Mint accent dark mode](/docs/screenshots/Mint-DarkMode.png) | + +### OG Image Examples + +Your accent, neutral, and color scheme preferences also apply to the generated OG image. + +| Light Mode | Dark Mode | +| ------------------------------------------------------------------------------ | ------------------------------------------------------------------------------- | +| **BLUE/MAUVE** ![Blue accent light mode OG image](/docs/og/Blue-LightMode.png) | **BLUE/MAUVE** ![Blue accent dark mode share image](/docs/og/Blue-DarkMode.png) | + +### Set Up Your CMS + +Next, modify the mock CMS data that is included in `edit-me/cms/`. Each Markdown file uses Front Matter fields that are used to add attributes to the item. These attributes are type safe, so the project won't run if required fields are missing or invalid. The rest of the Markdown file will be rendered as HTML to provide a description of the item. + +Although the mock files should be pretty self-explanatory, you can view the [CMS setup document](README-CMS.md) for detailed descriptions of required and optional fields. + +### Environment Variables + +Regardless of where the app is deployed, it may need access to the following environment variables: + +- `PRIVATE_KEY` (optional): this is a code, determined by the author, which will provide URL access to a version of the résumé that includes private information. We recommend generating this code (e.g. a UUID or using a password generator) + +## Private Link + +Your project can be configured to provide a secret URL that will display more information than the public URL. This is helpful if you want to send a complete résumé to a potential employer, or if you want to generate a PDF for your own use. In this version, you can include personal information such as email, phone number, and address that you don't want visible to the general public. + +### Setup + +The private URL will only work if you added a `PRIVATE_KEY` environment variable. If working locally, you can add this in a `.env.local` file: + +``` +PRIVATE_KEY=your-private-key +``` + +You can then visit `https://your-url.com/private/your-private-key` to see the private version of the résumé. + +### Adding Private Content + +For the built-in Markdown integration, please note that you **must be sure to not commit the private information to a public Git repo**. Only use this feature in a private repo, and even then _please be aware_ of the security concerns around commiting private information to any Git repo. + +To add private data to the CMS, simply add it to the `privateFields` folder. + +- `cms/privateFields/`. Add as many private contact information fields as you want to display. They will appear in the order they are arranged in the folder, so you can use a number prefix to order them. + - `label`: **required string**. The label of the field, such as "Email" or "Address". + +### Security + +This private URL is _only as secure as the people you send it to_. To invalidate an old private URL, you simply need to change the `PRIVATE_KEY` environment variable. + +## Design and Customizations + +The template is built to be responsive, beautiful, and accessible right out of the box. It supports automatic dark/light mode themeing in the web version, and a great single-page print layout in the PDF version. The project supports a minimal set of configurations such as accent colors, but if you're a front end developer or designer, you can easily open up the source code and customize it however you see fit. + +If you really want to go deep on customization, you can create your own themes in the `src/tokens` folder to add custom accent and neutral palettes. You also have full control of the Tailwind configuration in the root folder `tailwind.config.js` file. + +We use [Vercel OG Image Generation](https://vercel.com/docs/concepts/functions/edge-functions/og-image-generation) to generate dynamic Open Graph (Facebook/Twitter) share images. You can edit the layout, styles, and text of OG Image using Tailwind classes in `src/pages/api/og.tsx`. + +This dynamic share image will use your custom `accentColor` setting, as well as data from the CMS. diff --git a/docs/og/Blue-DarkMode.png b/docs/og/Blue-DarkMode.png new file mode 100644 index 0000000..f293c19 Binary files /dev/null and b/docs/og/Blue-DarkMode.png differ diff --git a/docs/og/Blue-LightMode.png b/docs/og/Blue-LightMode.png new file mode 100644 index 0000000..4a017ae Binary files /dev/null and b/docs/og/Blue-LightMode.png differ diff --git a/docs/screenshots/Blue-DarkMode.png b/docs/screenshots/Blue-DarkMode.png new file mode 100644 index 0000000..db7dcc2 Binary files /dev/null and b/docs/screenshots/Blue-DarkMode.png differ diff --git a/docs/screenshots/Blue-LightMode.png b/docs/screenshots/Blue-LightMode.png new file mode 100644 index 0000000..099ec0e Binary files /dev/null and b/docs/screenshots/Blue-LightMode.png differ diff --git a/docs/screenshots/Mint-DarkMode.png b/docs/screenshots/Mint-DarkMode.png new file mode 100644 index 0000000..5add6cb Binary files /dev/null and b/docs/screenshots/Mint-DarkMode.png differ diff --git a/docs/screenshots/Mint-LightMode.png b/docs/screenshots/Mint-LightMode.png new file mode 100644 index 0000000..e4a8336 Binary files /dev/null and b/docs/screenshots/Mint-LightMode.png differ diff --git a/docs/screenshots/Tomato-DarkMode.png b/docs/screenshots/Tomato-DarkMode.png new file mode 100644 index 0000000..d4b67ab Binary files /dev/null and b/docs/screenshots/Tomato-DarkMode.png differ diff --git a/docs/screenshots/Tomato-LightMode.png b/docs/screenshots/Tomato-LightMode.png new file mode 100644 index 0000000..ce6ba92 Binary files /dev/null and b/docs/screenshots/Tomato-LightMode.png differ diff --git a/edit-me/cms/achievements/0-some-certification.md b/edit-me/cms/achievements/0-some-certification.md new file mode 100644 index 0000000..dbc7fa5 --- /dev/null +++ b/edit-me/cms/achievements/0-some-certification.md @@ -0,0 +1,7 @@ +--- +achievement: Some Certification +completionYear: 2015 +institution: Some Program +--- + +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ultrices in iaculis nunc sed augue lacus viverra vitae congue. Neque viverra justo nec ultrices. Urna nunc id cursus metus aliquam eleifend mi in nulla. Proin sagittis nisl rhoncus mattis rhoncus urna neque viverra. Tristique senectus et netus et malesuada fames ac. diff --git a/edit-me/cms/achievements/1-some-degree.md b/edit-me/cms/achievements/1-some-degree.md new file mode 100644 index 0000000..5b4082c --- /dev/null +++ b/edit-me/cms/achievements/1-some-degree.md @@ -0,0 +1,7 @@ +--- +achievement: Some Degree +completionYear: 2013 +institution: Some University +--- + +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ultrices in iaculis nunc sed augue lacus viverra vitae congue. Neque viverra justo nec ultrices. Urna nunc id cursus metus aliquam eleifend mi in nulla. Proin sagittis nisl rhoncus mattis rhoncus urna neque viverra. Tristique senectus et netus et malesuada fames ac. diff --git a/edit-me/cms/hobbies.md b/edit-me/cms/hobbies.md new file mode 100644 index 0000000..7529867 --- /dev/null +++ b/edit-me/cms/hobbies.md @@ -0,0 +1,3 @@ +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ultrices in iaculis nunc sed augue lacus viverra vitae congue. Neque viverra justo nec ultrices. Urna nunc id cursus metus aliquam eleifend mi in nulla. Proin sagittis nisl rhoncus mattis rhoncus urna neque viverra. + +All Markdown files will be rendered as rich text, so you can include features such as [links](#). diff --git a/edit-me/cms/links.ts b/edit-me/cms/links.ts new file mode 100644 index 0000000..a960be9 --- /dev/null +++ b/edit-me/cms/links.ts @@ -0,0 +1,37 @@ +import { + faGithub, + faInstagram, + faLinkedin, + faNpm, + faTwitter, +} from '@fortawesome/free-brands-svg-icons'; +import { CMSLink } from '../../src/cms-integration/markdown/links'; + +export const links: CMSLink[] = [ + { + href: 'https://github.com', + icon: faGithub, + title: 'GitHub', + }, + { + href: 'https://www.instagram.com', + icon: faInstagram, + title: 'Instagram', + }, + { + href: 'https://www.linkedin.com', + icon: faLinkedin, + title: 'LinkedIn', + }, + { + href: 'https://www.npmjs.com', + icon: faNpm, + title: 'NPM', + }, + + { + href: 'https://twitter.com', + icon: faTwitter, + title: 'Twitter', + }, +]; diff --git a/edit-me/cms/personal.md b/edit-me/cms/personal.md new file mode 100644 index 0000000..6f1d0c7 --- /dev/null +++ b/edit-me/cms/personal.md @@ -0,0 +1,9 @@ +--- +location: Placeholder, TX +familyName: Body +givenName: Some +title: Official Job Title +twitterUsername: some_body +--- + +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ultrices in iaculis nunc sed augue lacus viverra vitae congue. Neque viverra [justo nec ultrices](#). Urna nunc id cursus metus aliquam eleifend mi in nulla. Proin sagittis nisl rhoncus mattis rhoncus urna neque viverra. diff --git a/edit-me/cms/privateFields/0-WARNING.md b/edit-me/cms/privateFields/0-WARNING.md new file mode 100644 index 0000000..7bce432 --- /dev/null +++ b/edit-me/cms/privateFields/0-WARNING.md @@ -0,0 +1,5 @@ +--- +label: WARNING +--- + +**Please be aware** of the security concerns of commiting private information to Git, whether it is a public or a private repo. See the README for more information on using the private feature, and note that we are not responsible if your data is exposed. diff --git a/edit-me/cms/professionalExperiences/0-some-nonprofit.md b/edit-me/cms/professionalExperiences/0-some-nonprofit.md new file mode 100644 index 0000000..bc9602b --- /dev/null +++ b/edit-me/cms/professionalExperiences/0-some-nonprofit.md @@ -0,0 +1,8 @@ +--- +endDate: February 2018 +organization: Some Nonprofit +startDate: April 2015 +title: Volunteer Position +--- + +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ultrices in iaculis nunc sed augue lacus viverra vitae congue. Neque viverra justo nec ultrices. Urna nunc id cursus metus aliquam eleifend mi in nulla. Proin sagittis nisl rhoncus mattis rhoncus urna neque viverra. Tristique senectus et netus et malesuada fames ac. diff --git a/edit-me/cms/professionalExperiences/1-some-company.md b/edit-me/cms/professionalExperiences/1-some-company.md new file mode 100644 index 0000000..3be45f3 --- /dev/null +++ b/edit-me/cms/professionalExperiences/1-some-company.md @@ -0,0 +1,7 @@ +--- +organization: Some Company +startDate: August 2019 +title: Official Job Title +--- + +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ultrices in iaculis nunc sed augue lacus viverra vitae congue. Neque viverra justo nec ultrices. Urna nunc id cursus metus aliquam eleifend mi in nulla. Proin sagittis nisl rhoncus mattis rhoncus urna neque viverra. Tristique senectus et netus et malesuada fames ac. Arcu cursus euismod quis viverra nibh cras pulvinar mattis nunc. Volutpat consequat mauris nunc congue nisi vitae suscipit. Venenatis lectus magna fringilla urna porttitor rhoncus. Id porta nibh venenatis cras. Felis bibendum ut tristique et egestas quis ipsum suspendisse. diff --git a/edit-me/cms/skills/0.md b/edit-me/cms/skills/0.md new file mode 100644 index 0000000..ba10c40 --- /dev/null +++ b/edit-me/cms/skills/0.md @@ -0,0 +1,5 @@ +--- +title: Proficient +--- + +SFTP, Drafting Agreements, HSPA, International Business, Honeywell DCS, Speech Writing, TPMS, XML Schema, Swedish, HNI diff --git a/edit-me/cms/skills/1.md b/edit-me/cms/skills/1.md new file mode 100644 index 0000000..9bcd750 --- /dev/null +++ b/edit-me/cms/skills/1.md @@ -0,0 +1,5 @@ +--- +title: Comfortable +--- + +Geotechnical Engineering, Sleepwear, Automotive Engineering, AAUS Scientific Diver, SLA, PBASIC, OmniPlan, Sales Presentations, Dispute Resolution, Kohana Framework diff --git a/edit-me/cms/skills/2.md b/edit-me/cms/skills/2.md new file mode 100644 index 0000000..9c00bc7 --- /dev/null +++ b/edit-me/cms/skills/2.md @@ -0,0 +1,5 @@ +--- +title: Familiar +--- + +Business Planning, WF, PFlow, XMLBeans, TCD, Jiu-Jitsu, AAR, General Insurance diff --git a/edit-me/config/Config.d.ts b/edit-me/config/Config.d.ts new file mode 100644 index 0000000..455bd12 --- /dev/null +++ b/edit-me/config/Config.d.ts @@ -0,0 +1,8 @@ +import accents from '../../src/tokens/accents'; +import neutrals from '../../src/tokens/neutrals'; + +interface ResumeConfig { + accentColor: keyof typeof accents; + neutralColor: keyof typeof neutrals; + ogImageTheme: 'dark' | 'light'; +} diff --git a/edit-me/config/favicon-512.png b/edit-me/config/favicon-512.png new file mode 100644 index 0000000..f74dcce Binary files /dev/null and b/edit-me/config/favicon-512.png differ diff --git a/edit-me/config/favicon.ico b/edit-me/config/favicon.ico new file mode 100644 index 0000000..c67c99c Binary files /dev/null and b/edit-me/config/favicon.ico differ diff --git a/edit-me/config/resumeConfig.js b/edit-me/config/resumeConfig.js new file mode 100644 index 0000000..2e99621 --- /dev/null +++ b/edit-me/config/resumeConfig.js @@ -0,0 +1,8 @@ +/** @type {import('./Config').ResumeConfig} */ +const resumeConfig = { + accentColor: 'blue', + neutralColor: 'mauve', + ogImageTheme: 'light', +}; + +module.exports = resumeConfig; diff --git a/jest.config.js b/jest.config.js new file mode 100644 index 0000000..44ae61d --- /dev/null +++ b/jest.config.js @@ -0,0 +1,14 @@ +const nextJest = require('next/jest'); + +const createJestConfig = nextJest({ + dir: './', +}); + +/** @type {import('jest').Config} */ +const customJestConfig = { + moduleDirectories: ['node_modules', 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ultrices in iaculis nunc sed augue lacus viverra vitae congue. Neque viverra justo nec ultrices. Urna nunc id cursus metus aliquam eleifend mi in nulla. Proin sagittis nisl rhoncus mattis rhoncus urna neque viverra. Tristique senectus et netus et malesuada fames ac.
\n', + slug: '1-some-degree', + }, + { + attributes: { + achievement: 'Some Certification', + completionYear: 2015, + institution: 'Some Program', + }, + html: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ultrices in iaculis nunc sed augue lacus viverra vitae congue. Neque viverra justo nec ultrices. Urna nunc id cursus metus aliquam eleifend mi in nulla. Proin sagittis nisl rhoncus mattis rhoncus urna neque viverra. Tristique senectus et netus et malesuada fames ac.
\n', + slug: '0-some-certification', + }, + ], + hobbies: { + html: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ultrices in iaculis nunc sed augue lacus viverra vitae congue. Neque viverra justo nec ultrices. Urna nunc id cursus metus aliquam eleifend mi in nulla. Proin sagittis nisl rhoncus mattis rhoncus urna neque viverra.
\nAll Markdown files will be rendered as rich text, so you can include features such as links.
\n', + }, + links: [ + { + href: 'https://github.com', + icon: { + prefix: 'fab', + iconName: 'github', + icon: [ + 496, + 512, + [], + 'f09b', + 'M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z', + ], + }, + title: 'GitHub', + }, + { + href: 'https://www.instagram.com', + icon: { + prefix: 'fab', + iconName: 'instagram', + icon: [ + 448, + 512, + [], + 'f16d', + 'M224.1 141c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9S339 319.5 339 255.9 287.7 141 224.1 141zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7zm146.4-194.3c0 14.9-12 26.8-26.8 26.8-14.9 0-26.8-12-26.8-26.8s12-26.8 26.8-26.8 26.8 12 26.8 26.8zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM398.8 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z', + ], + }, + title: 'Instagram', + }, + { + href: 'https://www.linkedin.com', + icon: { + prefix: 'fab', + iconName: 'linkedin', + icon: [ + 448, + 512, + [], + 'f08c', + 'M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z', + ], + }, + title: 'LinkedIn', + }, + { + href: 'https://www.npmjs.com', + icon: { + prefix: 'fab', + iconName: 'npm', + icon: [ + 576, + 512, + [], + 'f3d4', + 'M288 288h-32v-64h32v64zm288-128v192H288v32H160v-32H0V160h576zm-416 32H32v128h64v-96h32v96h32V192zm160 0H192v160h64v-32h64V192zm224 0H352v128h64v-96h32v96h32v-96h32v96h32V192z', + ], + }, + title: 'NPM', + }, + { + href: 'https://twitter.com', + icon: { + prefix: 'fab', + iconName: 'twitter', + icon: [ + 512, + 512, + [], + 'f099', + 'M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z', + ], + }, + title: 'Twitter', + }, + ], + personalInformation: { + attributes: { + location: 'Placeholder, TX', + familyName: 'Body', + givenName: 'Some', + title: 'Official Job Title', + twitterUsername: 'some_body', + }, + html: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ultrices in iaculis nunc sed augue lacus viverra vitae congue. Neque viverra justo nec ultrices. Urna nunc id cursus metus aliquam eleifend mi in nulla. Proin sagittis nisl rhoncus mattis rhoncus urna neque viverra.
\n', + }, + professional: [ + { + attributes: { + organization: 'Some Company', + startDate: 'August 2019', + title: 'Official Job Title', + }, + html: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ultrices in iaculis nunc sed augue lacus viverra vitae congue. Neque viverra justo nec ultrices. Urna nunc id cursus metus aliquam eleifend mi in nulla. Proin sagittis nisl rhoncus mattis rhoncus urna neque viverra. Tristique senectus et netus et malesuada fames ac. Arcu cursus euismod quis viverra nibh cras pulvinar mattis nunc. Volutpat consequat mauris nunc congue nisi vitae suscipit. Venenatis lectus magna fringilla urna porttitor rhoncus. Id porta nibh venenatis cras. Felis bibendum ut tristique et egestas quis ipsum suspendisse.
\n', + slug: '1-some-company', + }, + { + attributes: { + endDate: 'February 2018', + organization: 'Some Nonprofit', + startDate: 'April 2015', + title: 'Volunteer Position', + }, + html: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ultrices in iaculis nunc sed augue lacus viverra vitae congue. Neque viverra justo nec ultrices. Urna nunc id cursus metus aliquam eleifend mi in nulla. Proin sagittis nisl rhoncus mattis rhoncus urna neque viverra. Tristique senectus et netus et malesuada fames ac.
\n', + slug: '0-some-nonprofit', + }, + ], + skills: [ + { + attributes: { title: 'Proficient' }, + html: 'SFTP, Drafting Agreements, HSPA, International Business, Honeywell DCS, Speech Writing, TPMS, XML Schema, Swedish, HNI
\n', + slug: '0', + }, + { + attributes: { title: 'Comfortable' }, + html: 'Geotechnical Engineering, Sleepwear, Automotive Engineering, AAUS Scientific Diver, SLA, PBASIC, OmniPlan, Sales Presentations, Dispute Resolution, Kohana Framework
\n', + slug: '1', + }, + { + attributes: { title: 'Familiar' }, + html: 'Business Planning, WF, PFlow, XMLBeans, TCD, Jiu-Jitsu, AAR, General Insurance
\n', + slug: '2', + }, + ], +}; + +export const getCMSIntegration = jest.fn().mockResolvedValue(mockData); diff --git a/src/cms-integration/getCMSIntegration.ts b/src/cms-integration/getCMSIntegration.ts new file mode 100644 index 0000000..27352d8 --- /dev/null +++ b/src/cms-integration/getCMSIntegration.ts @@ -0,0 +1,39 @@ +import { CMSAchievement, getAchievements } from './markdown/achievements'; +import { CMSHobbies, getHobbies } from './markdown/hobbies'; +import { CMSLink, getLinks } from './markdown/links'; +import { + CMSPersonalInformation, + getPersonalInformation, +} from './markdown/personal'; +import { CMSPrivateInformation } from './markdown/private'; +import { + CMSProfessionalExperience, + getProfessionalExperiences, +} from './markdown/professional'; +import { CMSSkillCategory, getSkillCategories } from './markdown/skills'; + +type CMS = 'markdown'; + +export interface CMSData { + achievements: CMSAchievement[]; + hobbies: CMSHobbies; + links: CMSLink[]; + personalInformation: CMSPersonalInformation; + privateInformation?: CMSPrivateInformation[]; + professional: CMSProfessionalExperience[]; + skills: CMSSkillCategory[]; +} + +export const getCMSIntegration = async (cms: CMS): Promise