mirror of
https://github.com/r-freeman/portfolio.git
synced 2024-11-11 18:45:41 +00:00
122 lines
6.8 KiB
TypeScript
122 lines
6.8 KiB
TypeScript
import Head from 'next/head'
|
||
|
||
import {Card} from '@/components/ui/Card'
|
||
import {Section} from '@/components/ui/Section'
|
||
import {SimpleLayout} from '@/components/layouts/SimpleLayout'
|
||
import {ReactNode} from 'react'
|
||
|
||
function ToolsSection({children, title}: { children: ReactNode, title: string }) {
|
||
return (
|
||
<Section title={title}>
|
||
<ul role="list" className="space-y-16">
|
||
{children}
|
||
</ul>
|
||
</Section>
|
||
)
|
||
}
|
||
|
||
function Tool({title, href, children}: { title: string, href: string, children: ReactNode }) {
|
||
return (
|
||
<Card as="li">
|
||
<Card.Title as="h3" href={href}>
|
||
{title}
|
||
</Card.Title>
|
||
<Card.Description>{children}</Card.Description>
|
||
</Card>
|
||
)
|
||
}
|
||
|
||
export default function Uses() {
|
||
return (
|
||
<>
|
||
<Head>
|
||
<title>Uses - Ryan Freeman</title>
|
||
<meta
|
||
name="description"
|
||
content="Software I use, equipment that makes my job easier, and other things I recommend."
|
||
/>
|
||
<meta
|
||
property="og:title"
|
||
content="Uses - Ryan Freeman"
|
||
/>
|
||
<meta
|
||
property="og:description"
|
||
content="Software I use, equipment that makes my job easier, and other things I recommend."
|
||
/>
|
||
</Head>
|
||
<SimpleLayout
|
||
title="Software I use, equipment that makes my job easier, and other things I recommend."
|
||
intro="I get asked a lot about the things I use to build software and stay productive. Here’s a big list of all of my favourite gear."
|
||
gradient="bg-gradient-to-r from-orange-400 to-rose-400"
|
||
>
|
||
<div className="space-y-20">
|
||
<ToolsSection title="Workstation">
|
||
<Tool title="PC Build 2022" href="https://pcpartpicker.com/b/KXfPxr">
|
||
This is my main Intel-based computer which I built in 2022. I've recently added more storage and
|
||
a new monitor. Click here to see a comprehensive listing of all the parts used in this build on
|
||
PCPartPicker.
|
||
</Tool>
|
||
<Tool title="Herman Miller Aeron Chair"
|
||
href="https://hermanmiller.com/en_eur/products/seating/office-chairs/aeron-chairs/">
|
||
I bought this chair second-hand when I started working for Apple, it's extremely comfortable and
|
||
ergonomic for those long hours spent at the desk.
|
||
</Tool>
|
||
</ToolsSection>
|
||
<ToolsSection title="Development tools">
|
||
<Tool title="JetBrains" href="https://jetbrains.com/">
|
||
I use a mix of JetBrain apps for my IDEs depending on what I'm working on. For JavaScript
|
||
projects, I use WebStorm. PyCharm for python and IntelliJ IDEA Ultimate for Java. I use the same
|
||
keyboard shortcuts across these apps which is great for productivity.
|
||
</Tool>
|
||
<Tool title="Insomnia" href="https://insomnia.rest/">
|
||
Good tool for designing and testing REST APIs. I used to use Postman but I found the interface too
|
||
cluttered and prefer the simplicity of Insomnia.
|
||
</Tool>
|
||
</ToolsSection>
|
||
<ToolsSection title="Productivity">
|
||
<Tool title="RegionToShare" href="https://github.com/tom-englert/RegionToShare">
|
||
Great app for Windows which allows you share a region of the screen, handy for single monitor
|
||
set ups such as ultrawides when you don't want to share the entire screen.
|
||
</Tool>
|
||
</ToolsSection>
|
||
<ToolsSection title="Design">
|
||
<Tool title="Balsamiq Wireframes" href="https://balsamiq.com/">
|
||
I use this software for creating low-fidelity wireframes and interfaces. It's great for
|
||
experimenting with ideas.
|
||
</Tool>
|
||
<Tool title="Color Picker" href="https://learn.microsoft.com/en-us/windows/powertoys/color-picker">
|
||
Color Picker is included in the PowerToys set of enhancements for Windows. Using the eye dropper you
|
||
can easily identify colours on the screen and copy the colour's code to your clipboard for use
|
||
in other applications.
|
||
</Tool>
|
||
</ToolsSection>
|
||
<ToolsSection title="Automation">
|
||
<Tool title="AutoHotKey" href="https://autohotkey.com/">
|
||
AutoHotKey features it's own scripting language and allows you to create keyboard macros for
|
||
automating common tasks. For example, I use AutoHotKey to toggle between dark and light themes in
|
||
Windows on the fly.
|
||
</Tool>
|
||
</ToolsSection>
|
||
<ToolsSection title="Chrome Extensions">
|
||
<Tool title="Bitwarden"
|
||
href="https://chrome.google.com/webstore/detail/bitwarden-free-password-m/nngceckbapebfimnlniiiahkandclblb">
|
||
Bitwarden is a free, open-source password manager, this Chrome Extension connects to a self-hosted
|
||
instance of Bitwarden which lives on my Raspberry Pi. It is really useful for syncing passwords across
|
||
devices.
|
||
</Tool>
|
||
<Tool title="uBlock Origin"
|
||
href="https://chrome.google.com/webstore/detail/ublock-origin/cjpalhdlnbpafiamejdnhcphjbkeiagm">
|
||
Great extension for blocking those annoying YouTube ads and nasty tracking scripts.
|
||
</Tool>
|
||
<Tool title="Floccus"
|
||
href="https://chrome.google.com/webstore/detail/floccus-bookmarks-sync/fnaicdffflnofjppbagibeoednhnbjhg">
|
||
Floccus syncs your bookmarks across browsers and devices. It connects to my Nextcloud server via
|
||
WebDAV and keeps my bookmarks in sync, so no matter which device I'm using, I always have the
|
||
same set of bookmarks.
|
||
</Tool>
|
||
</ToolsSection>
|
||
</div>
|
||
</SimpleLayout>
|
||
</>
|
||
)
|
||
} |