29 Commits

Author SHA1 Message Date
Sravan Balaji
09c69b92bb Start Adding Part Time Work
- Update bio tense a bit
- Update podcast art
- Add UMICH Rec Sports image
- Start adding rec sports jobs to portfolio page
2022-07-30 20:07:10 -04:00
Sravan Balaji
7fbedea388 Update Oryx Pro 7 Review
- Remove details about freezing / crashing and replace
  with solutions I found to resolve them
2022-07-01 22:16:18 -04:00
Sravan Balaji
f044b27a34 Update Windows to Linux Blog Post
- Add "Are We Anti-Cheat Yet?" website
- Update that oryx pro issues were resolved
  through suggestions on ArchWiki
2022-07-01 21:13:26 -04:00
Sravan Balaji
b10995bbef Ferdium and YouTube Vanced Updates
- Remove executable permission from logo-spotify.png
- Replace Ferdi with Ferdium in software section
  of personal page
- Replace ferdi logo with ferdium
- Update YouTube Vanced info with current status
  of project
2022-06-02 19:35:17 -04:00
Sravan Balaji
01298d0249 Associate Autonomous Systems Engineer at MITRE Update 2022-01-25 10:49:36 -05:00
Sravan Balaji
87f653243a Notion Enhancer Update
- Update link to notion enhancer website under notion
- Add notion-enhancer chrome extension link under vivaldi
2021-12-31 08:40:48 -05:00
Sravan Balaji
d8cc6f8ef6 End of Fall 2021 Semester Updates
- Add completion of Master's in Robotics to about
  and portfolio page and update GPA
- Add Autonomous Systems Engineer position to
  portfolio
- Add start/end days to all positions in case
  I need them for job applications
- Fix closing div position in portfolio page
- Add F1 to personal interests
- Remove Bootleg Football podcast
- Remove podcast authors from podcast title
- Update Football Weekly podcast description
- Add Missed Apex F1 podcast
2021-12-25 11:29:40 -05:00
Sravan Balaji
dbba94a679 Update Linux Related Blog Posts
- Update screenshot of dwm-flexipatch setup
- Add solution I found for system freezing on oryp7
- Replace "customizability" with "ArchWiki" in reasons for using Arch
2021-12-07 14:49:58 -05:00
Sravan Balaji
2973477f69 Add Bitwarden & Lutris to Software
- Re-order platforms in software section
  (Web, Linux, Windows, macOS, Android, iOS)
- Add list of browser extension I use for Vivaldi
- Add bitwarden and logo to software section
- Add lutris and logo to software section
2021-09-26 17:51:51 -04:00
Sravan Balaji
942040d68b Update Video Games Section
- Remove steam profile from video games section
- Add some paragraph text under favorite games section
- Add link to my Grouvee video game collection profile
- Change favorite game list to 3 columns style
- Add line breaks between platform images and list
- Update favorite video game list
2021-09-26 16:53:44 -04:00
Sravan Balaji
bc54bf81f7 Emacs & Update Video Games and Podcasts Lists
- Add emacs to software list
- Update VS Code description
- Update favorite video games list and order alphabetically
- Update favorite podcasts list and order alphabetically
- Update football weekly podcast image
2021-09-17 09:54:51 -04:00
Sravan Balaji
bcca7464c3 MITRE Internship Description & Bio Update
- Prettier (emacs) formatting of html files
- Update bio for post-summer 2021
- Add full-time job at MITRE for 2022 in bio
- Change Fall 2021 semester to current in portfolio
- Add description of MITRE Graduate Navigation Internship to portfolio
2021-09-16 22:35:04 -04:00
Sravan Balaji
f9f6b9331c Small blog post updates
- Added some more links and fleshed out wording
- Fixed some consistency issues
2021-08-27 12:19:57 -04:00
Sravan Balaji
94c8db5975 New Blog Posts & Hardware Updates
- Add docker whale image locally
- Add oryx pro review
- Add blog post on linux journey
- Update VS Code Extensions
- Replace Brave with Vivaldi
- Replace desktop and HP Spectre with oryx pro in hardware
- Update Surface Go and Sony headphones sections of hardware
- Add and delete some images
2021-08-26 16:59:30 -04:00
Sravan Balaji
fdf342e205 End of Winter 2021 Updates
- Update bio page with info about summer 2021 internship
- Update portfolio page with Winter 2021 GPA, Fall 2021 classes, and summer 2021 internship
2021-05-04 14:00:33 -04:00
Sravan Balaji
c78fb4b0af Signal & Winter 2021 Course Update
- Add Signal to software section
- Update Winter 2021 course list
2021-01-18 20:30:36 -05:00
Sravan Balaji
4b02f3ef81 NA 568 Grader Position Update
- Add NA 568 grader position to bio
2021-01-15 13:37:42 -05:00
Sravan Balaji
bacf147758 Small Changes & Fixes
- Add line break between captions and images in about page
- Expand welcome section of index page
- Fixe YouTube vanced link
2020-12-21 12:30:52 -05:00
Sravan Balaji
be4b6857fa End of Fall 2020 Updates
- Update bio to reference completed Bachelor's degrees
- Update GPA for undergrad
- Add courses for Winter 2021 semester
2020-12-20 15:37:08 -05:00
Sravan Balaji
13919c27e5 Summer 2021 Internship
- Update bio to include summer 2021 internship at MITRE
2020-11-23 11:25:57 -05:00
Sravan Balaji
b5d59fec5e Robotics MS Update
- Update about page to include admission to Robotics MS
- Update academic/professional interests in about page
- Change semester order to new->old in portfolio page
- Add M.S. in Robotics to education section
- Add UMICH robotics logo
2020-11-13 12:06:21 -05:00
Sravan Balaji
53f23794d4 Windows Past Tense, Update Images, Update Software
- Update email, github, linkedin, and color palette images
- Add YouTube, color palette, and spotify images
- Add link to YouTube channel in about page
- Update references to Windows 10 to past tense
- Update coolors color scheme to use new link color
- Add notion-enhancer to software section
- Add more info to pocket casts section
- Add spotify and spicetify to software section
- Add speaker issues to HP Spectre x360 section
2020-11-02 10:31:49 -05:00
Sravan Balaji
c032f1ded8 Remove Chocolatey
- Remove references to chocolatey in docker blog post
2020-10-24 19:43:35 -04:00
Sravan Balaji
46f7e466ec Personal Page Updates
- Remove chocolatey and references to choco install
- Update VSCode extensions and theme
- Replace Clatter with Ferdi
- Remove windows specific software
- Replace edge with brave
- Fix wording in hardware section
- Update steam profile
- Update favorite game list
- Update podcasts
- Add logos for new sections and remove old ones
2020-10-24 19:42:02 -04:00
Sravan Balaji
3e1d17c406 Style Fixes & highlight.js
- Add highlight.js for code blocks
- Specify docker code block language
- Add dracula theme to documentation
- Update color palette to work better in light mode
- Add extra colors to styles.css
- Style label, links, code, horizontal rule, and accordion
2020-10-24 18:48:12 -04:00
Sravan Balaji
a2d4b78a37 Dracula Dark Theme
- Clean up dark mode javascript
- Change label with color mode
- Change dark mode colors to dracula style
- Change document load to ready so CSS is applied faster
2020-10-24 17:57:09 -04:00
Sravan Balaji
0ac764778d Dark Mode
- Add dark mode toggle button to navbar
- Parameterize colors in styles.css
- Add dark mode button javascript
2020-10-24 17:15:55 -04:00
Sravan Balaji
0eab7a5df1 Documentation Update
- Add paragraph on namecheap
- Split text into separate paragraphs
- Add paragraph on netlify web hosting
2020-10-24 16:17:16 -04:00
Sravan Balaji
e31b13191b Updated Content, Single Stylesheet, Whitespace Changes
- Update whitespace formatting with prettier extension
- Reorganize files under src folder
- Move html files out of web_pages folder
- Move stylesheet into style folder
- Change links from old repo to new repo
- Clean-up some files
- Move all in-line styles to styles.css
2020-10-24 15:00:43 -04:00
118 changed files with 5331 additions and 2164 deletions

View File

@@ -4,8 +4,8 @@ This is the repository for my personal website, which can be found at [sravanbal
## Development Progress
You can follow my current development plans for this website on my [GitHub project](https://github.com/balajsra/balajsra.github.io/projects/1).
You can follow the development of this website on my [GitHub project](https://github.com/balajsra/sravanbalaji.com).
## Feedback & Suggestions
If you find any issues or have suggestions for ways to improve my website, please submit a bug or enhancement request on [GitHub](https://github.com/balajsra/balajsra.github.io/issues).
If you find any issues or have suggestions for ways to improve my website, please submit a bug or enhancement request on [GitHub](https://github.com/balajsra/sravanbalaji.com/issues).

Binary file not shown.

Before

Width:  |  Height:  |  Size: 9.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.5 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 432 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 198 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 43 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 30 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 46 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 84 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 6.5 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 196 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 36 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 11 KiB

View File

@@ -1,179 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<script language="javascript" type="text/javascript" src="../common/header.txt"></script>
<title>Docker</title>
<style>
img {
max-height: 500px;
margin: auto;
display: block;
}
</style>
</head>
<script language="javascript" type="text/javascript" src="../common/navbar.txt"></script>
<body>
<div class="container-fluid px-md-6">
<div class="row align-items-center">
<div class="col-md-2">
<!-- Nothing -->
</div>
<div class="col-md-8">
<!-- Title -->
<h1>Getting Started with Docker</h1>
<!-- Author & Date/Time -->
<p class="lead">
Updated on March 18, 2020
</p>
<!-- Preview Image -->
<img class="img-fluid rounded" src="https://cdn.vox-cdn.com/thumbor/fbrTLtxuP2D29o8VJUaE-u3NKfU=/0x0:792x613/1200x800/filters:focal(300x237:426x363)/cdn.vox-cdn.com/uploads/chorus_image/image/59850273/Docker_logo_011.0.png" alt="">
<hr>
<!-- Post Content -->
<h2><a name="introduction">Introduction</a></h2>
<p>
Throughout my college career in computer science, I have found the need to develop applications that will be deployed in a Linux environment. As a windows user, I have usually turned to a couple of different options: virtual machines, <a href="https://docs.microsoft.com/en-us/windows/wsl/about" target="_blank">Windows Subsystem for Linux</a>, or <a href="https://www.cygwin.com" target="_blank">Cygwin</a>. Recently, I discovered an alternative method for building and testing Linux apps that is especially useful for collaboration and deployment. Docker allows you to package an OS and all the necessary dependencies into a <b>docker image</b>. You can then spin up an instance of this image called a <b>docker container</b> in which you can run your source code. Jake Wright's video was incredibly helpful in my understanding of what docker is, how it's different from virtual machines, and how to use it.
</p>
<div class="embed-responsive embed-responsive-16by9">
<iframe class="embed-responsive-item" src="https://www.youtube-nocookie.com/embed/YFl2mCHdv24" allowfullscreen></iframe>
</div>
<hr>
<h2><a name="installing_docker">Installing Docker</a></h2>
<p>
Depending on your host machine's operating system, you will install one of the following Docker products. If you have macOS or Windows, your first option should be Docker Desktop. Check if you meet the system requirements. If you do not, Docker Toolbox is the legacy option that uses Oracle VirtualBox rather than Hyper-V or HyperKit for virtualization. I am using a computer with Windows 10 Home, so I use Docker Toolbox for Windows. This blog post will discuss some solutions to edge-case issues with Docker Toolbox that Docker Desktop users will hopefully not have to deal with.
</p>
<ul>
<li>macOS</li>
<ul>
<li><a href="https://docs.docker.com/docker-for-mac/install/" target="_blank">Docker Desktop for Mac</a></li>
<li><a href="https://docs.docker.com/toolbox/toolbox_install_mac/" target="_blank">Docker Toolbox for macOS</a> (Legacy)</li>
</ul>
<li>Windows</li>
<ul>
<li><a href="https://docs.docker.com/docker-for-windows/install/" target="_blank">Docker Desktop for Windows</a></li>
<ul>
<li><a href="https://chocolatey.org/packages/docker-desktop/2.2.0.4" target="_blank">Chocolatey</a>: <code>choco install docker-desktop</code></li>
</ul>
<li><a href="https://docs.docker.com/toolbox/toolbox_install_windows/" target="_blank">Docker Toolbox for Windows</a> (Legacy)</li>
<ul>
<li><a href="https://chocolatey.org/packages/docker-toolbox" target="_blank">Chocolatey</a>: <code>choco install docker-toolbox</code></li>
</ul>
</ul>
<li>Linux</li>
<ul>
<li><a href="https://docs.docker.com/install/linux/docker-ce/centos/" target="_blank">Docker Engine - Community for CentOS</a></li>
<li><a href="https://docs.docker.com/install/linux/docker-ce/debian/" target="_blank">Docker Engine - Community for Debian</a></li>
<li><a href="https://docs.docker.com/install/linux/docker-ce/fedora/" target="_blank">Docker Engine - Community for Fedora</a></li>
<li><a href="https://docs.docker.com/install/linux/docker-ce/ubuntu/" target="_blank">Docker Engine - Community for Ubuntu</a></li>
</ul>
</ul>
<h3>Docker Toolbox & WSL</h3>
<p>
As mentioned previously, I am using Docker Toolbox since Windows 10 Home does not support Hyper-V for virtualization with Docker Desktop. You can run docker toolbox in a command prompt or powershell terminal, but I personally prefer to use WSL because I am more familiar with bash terminal commands. If you are interested in this setup, continue reading this section. Otherwise, you can skip ahead.
</p>
<h4>Installing WSL</h4>
<p>
The default way to install WSL is through the <a href="https://docs.microsoft.com/en-us/windows/wsl/about" target="_blank">Microsoft Store</a>. This will install WSL on your system drive (e.g. C:\). If you are like me and don't want to install it on your system drive, follow the instructions <a href="https://kontext.tech/column/tools/308/how-to-install-windows-subsystem-for-linux-on-a-non-c-drive" target="_blank">here</a>.
</p>
<h4>Setting Up Docker Toolbox with WSL</h4>
<p>
After installing WSL, follow the instructions in <a href="https://medium.com/@joaoh82/setting-up-docker-toolbox-for-windows-home-10-and-wsl-to-work-perfectly-2fd34ed41d51" target="_blank">Setting Up Docker Toolbox for Windows Home 10 and WSL to Work Perfectly!</a> starting with <b>Install Docker and Docker Compose within WSL</b>. As you will have seen near the end of that post, there are some extra steps needed to ensure that volume mounts work. After setting <code>root = /</code>, you will need to configure shared folders for the <code>default</code> docker machine in VirtualBox.
</p>
<h4>Shared Folder Configuration for Volume Mounting</h4>
<p>
I configured all of my drives as shared folders so I can mount any folders on my host machine to any docker containers I run. In your WSL terminal, run <code>docker-machine.exe start</code> to start the <code>default</code> docker machine created by the Docker Quickstart Terminal. After your docker machine is running, open the shared folder settings as shown in <a href="https://medium.com/@Charles_Stover/fixing-volumes-in-docker-toolbox-4ad5ace0e572" target="_blank">Fixing Volumes in Docker Toolbox</a>. The image below shows how <code>C:\</code> on my host computer is mounted at <code>/</code> in folder <code>c</code> on my docker machine such that <code>C:\</code> maps to <code>/c</code>. Make sure you have enabled <code>Auto-mount</code> and <code>Make Permanent</code>. Click <b>OK</b> to save all settings, then go back to the WSL terminal and run <code>docker-machine.exe restart default</code>. Now your docker machine should be properly configured to allow volume mounting.
</p>
<img class="img-fluid mx-auto d-block" src="../assets/blog_posts/Docker/virtual_box_shared_folder.jpg">
<h4>Increase Docker Machine Resources</h4>
<p>
One issue I ran into with the default settings for the <code>default</code> docker machine is the amount of RAM allocated to it. I attempted to build the <a href="https://github.com/borglab/gtsam" target="_blank">GTSAM</a> library inside a docker container and ran into an <i>internal compiler error: Killed (program cc1plus)</i>. As mentioned <a href="https://github.com/docker/for-win/issues/403" target="_blank">here</a>, the solution is to increase the RAM allocated to the docker machine in VirtualBox. In the WSL terminal, run <code>docker-machine.exe stop</code> to shutdown the docker machine. When this is complete, right click on the <code>default</code> docker machine in VirtualBox and open <b>Settings</b>. In the <b>System</b> tab, increase <i>Base Memory</i>. Similar to virtual machines, I would not recommend allocating more than half of your system's RAM. For example, my computer has 16 GB of RAM, so I would only recommend allocating up to 8 GB of RAM to the docker machine. You can look through the other options, such as number of allocated processor cores, as well if you wish.
</p>
<hr>
<h2><a name="building_images_and_running_containers">Building Images & Running Containers</a></h2>
<p>
To learn about Dockerfiles and a basic example, check out the video in the <a href="#introduction">introduction</a>. To learn about Docker Compose, check out Jake Wright's video on the topic.
</p>
<div class="embed-responsive embed-responsive-16by9">
<iframe class="embed-responsive-item" src="https://www.youtube-nocookie.com/embed/Qw9zlE3t8Ko" allowfullscreen></iframe>
</div>
<hr>
<h2><a name="x_forwarding">X Forwarding for GUI Applications</a></h2>
<p>
In a virtual machine, you can easily run GUI applications such as a web browser, text editor, etc. In a docker container, the process is a little bit different. You will need to download an X Server such as <a href="https://sourceforge.net/projects/vcxsrv/" target="_blank">VcXsrv Windows X Server</a>. If you are using <a href="https://chocolatey.org/packages/vcxsrv" target="_blank">chocolatey</a>, you can run <code>choco install vcxsrv</code>.
</p>
<p>
<a href="https://dev.to/darksmile92/run-gui-app-in-linux-docker-container-on-windows-host-4kde" target="_blank">Run GUI app in linux docker container on windows host</a> provides a great explanation of why you would want to do this and how to run your docker container. The post discusses how to set your IP address as the <code>DISPLAY</code> environment variable that is passed to docker via the <code>-e DISPLAY=$DISPLAY</code> command line argument. You can alternatively pass your IP address as an environment variable in your docker compose file. This is shown in <a href="https://github.com/MAAV-Software/ros-tutorial" target="_blank">MAAV's ROS Tutorial</a> (reproduced below). The main settings to look at below are <code>environment</code> and <code>network_mode</code>. Set the <code>DISPLAY</code> environment variable to <code>[ip_address]:0.0</code> and set <code>network_mode: "host"</code>.
</p>
<pre>
<code>
# docker-compose.yml
version: "2"
services:
ros-demo:
image: ros-demo
privileged: true
volumes:
# Mount the current directory do everything in /tutorial within docker
- .:/tutorial:rw
environment:
- DISPLAY=1.1.1.1:0.0 # Change 1.1.1.1 to your IP Address
network_mode: "host"
container_name: ros-demo
command: "/bin/bash --init-file scripts/source-ros.sh" #source ros automatically
</code>
</pre>
<hr>
<h2><a name="helpful_commands">Helpful Docker Commands</a></h2>
<p>
<ul>
<li>System Prune to clear space on Docker Machine</li>
<ul>
<li><code>docker system prune --volumes</code></li>
</ul>
</ul>
</p>
<hr>
<h2><a name="conclusion">Conclusion</a></h2>
<p>
Hopefully by this point, you have a better understanding of what docker is, why you might want to use it, and how to get a docker machine setup so you can build and run docker containers. If you have any questions or suggestions for improvement, feel free to <a href="../web_pages/about.html#contact_me">contact me</a>.
</p>
<hr>
</div>
<div class="col-md-2">
<!-- Nothing -->
</div>
</div>
</div>
</body>
<footer>
<script language="javascript" type="text/javascript" src="../common/footer.txt"></script>
</footer>
</html>

View File

@@ -1,9 +0,0 @@
<div class="container-fluid px-md-6">
<div class="row align-items-center">
<div class="col-md-12">
<small>
Copyright &copy; 2019 Sravan Balaji under <a rel="license" href="https://docs.google.com/gview?url=https://github.com/balajsra/balajsra.github.io/raw/master/LICENSE" target="_blank">MIT License</a>
</small>
</div>
</div>
</div>

View File

@@ -1,22 +0,0 @@
<!--Required meta tags-->
<meta charset="utf-8">
<meta name="author" content="Sravan Balaji">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<!-- Popper JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
<!-- Stylesheet -->
<link rel="stylesheet" type="text/css" href="../common/styles.css"/>
<!-- Favicon -->
<link rel="icon" href="../assets/branding/favicon.ico" type="image/x-icon"/>

View File

@@ -1 +0,0 @@
document.write('<!--Required meta tags--> <meta charset="utf-8"> <meta name="author" content="Sravan Balaji"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- Latest compiled and minified CSS --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"> <!-- jQuery library --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <!-- Popper JS --> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script> <!-- Latest compiled JavaScript --> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script> <!-- Stylesheet --> <link rel="stylesheet" type="text/css" href="../common/styles.css"/> <!-- Favicon --> <link rel="icon" href="../assets/branding/favicon.ico" type="image/x-icon"/>')

View File

@@ -1,111 +0,0 @@
<nav class="navbar my-nav navbar-expand-md fixed-top">
<!-- Brand -->
<a class="navbar-brand" href="../web_pages/index.html">
<img src="../assets/branding/logo.png" alt="Icon" width="30px" height="30px" class="d-inline-block align-top">
<img src="../assets/branding/name.png" alt="Name" height="30px" class="d-inline-block align-center">
</a>
<!-- Toggler/collapsibe Button -->
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
<span class="navbar-toggler-icon"></span>
</button>
<!-- Navbar links -->
<div class="collapse navbar-collapse" id="collapsibleNavbar">
<ul class="navbar-nav">
<!-- About -->
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="../web_pages/about.html" id="navbardrop" data-toggle="dropdown">
About
</a>
<div class="dropdown-menu">
<a class="dropdown-item" href="../web_pages/about.html#bio">
Bio
</a>
<a class="dropdown-item" href="../web_pages/about.html#contact_me">
Contact Me
</a>
</div>
</li>
<!-- Portfolio -->
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="../web_pages/portfolio.html" id="navbardrop" data-toggle="dropdown">
Portfolio
</a>
<div class="dropdown-menu">
<a class="dropdown-item" href="../web_pages/portfolio.html#resume">
Resume
</a>
<a class="dropdown-item" href="../web_pages/portfolio.html#education">
Education
</a>
<a class="dropdown-item" href="../web_pages/portfolio.html#professional_experience">
Professional Experience
</a>
<!-- <a class="dropdown-item" href="../web_pages/portfolio.html#research">
Research
</a>
<a class="dropdown-item" href="../web_pages/portfolio.html#projects">
Projects
</a> -->
</div>
</li>
<!-- Personal -->
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="../web_pages/personal.html" id="navbardrop" data-toggle="dropdown">
Personal
</a>
<div class="dropdown-menu">
<a class="dropdown-item" href="../web_pages/personal.html#software">
Software
</a>
<a class="dropdown-item" href="../web_pages/personal.html#hardware">
Hardware
</a>
<a class="dropdown-item" href="../web_pages/personal.html#video_games">
Video Games
</a>
<a class="dropdown-item" href="../web_pages/personal.html#podcasts">
Podcasts
</a>
<a class="dropdown-item" href="../web_pages/personal.html#music">
Music
</a>
</div>
</li>
<!-- Blog -->
<li class="nav-item">
<a class="nav-link" href="../web_pages/blog.html">
Blog
</a>
</li>
<!-- Documentation -->
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="../web_pages/documentation.html" id="navbardrop" data-toggle="dropdown">
Documentation
</a>
<div class="dropdown-menu">
<a class="dropdown-item" href="../web_pages/documentation.html#introduction">
Introduction
</a>
<a class="dropdown-item" href="../web_pages/documentation.html#website_hosting">
Website Hosting
</a>
<a class="dropdown-item" href="../web_pages/documentation.html#web_design">
Web Design
</a>
<a class="dropdown-item" href="../web_pages/documentation.html#aesthetics">
Aesthetics
</a>
<a class="dropdown-item" href="../web_pages/documentation.html#inspiration">
Inspiration
</a>
</div>
</li>
</ul>
</div>
</nav>

View File

@@ -1 +0,0 @@
document.write('<nav class="navbar my-nav navbar-expand-md fixed-top"> <!-- Brand --> <a class="navbar-brand" href="../web_pages/index.html"> <img src="../assets/branding/logo.png" alt="Icon" width="30px" height="30px" class="d-inline-block align-top"> <img src="../assets/branding/name.png" alt="Name" height="30px" class="d-inline-block align-center"> </a> <!-- Toggler/collapsibe Button --> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar"> <span class="navbar-toggler-icon"></span> </button> <!-- Navbar links --> <div class="collapse navbar-collapse" id="collapsibleNavbar"> <ul class="navbar-nav"> <!-- About --> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" href="../web_pages/about.html" id="navbardrop" data-toggle="dropdown"> About </a> <div class="dropdown-menu"> <a class="dropdown-item" href="../web_pages/about.html#bio"> Bio </a> <a class="dropdown-item" href="../web_pages/about.html#contact_me"> Contact Me </a> </div> </li> <!-- Portfolio --> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" href="../web_pages/portfolio.html" id="navbardrop" data-toggle="dropdown"> Portfolio </a> <div class="dropdown-menu"> <a class="dropdown-item" href="../web_pages/portfolio.html#resume"> Resume </a> <a class="dropdown-item" href="../web_pages/portfolio.html#education"> Education </a> <a class="dropdown-item" href="../web_pages/portfolio.html#professional_experience"> Professional Experience </a> <!-- <a class="dropdown-item" href="../web_pages/portfolio.html#research"> Research </a> <a class="dropdown-item" href="../web_pages/portfolio.html#projects"> Projects </a> --> </div> </li> <!-- Personal --> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" href="../web_pages/personal.html" id="navbardrop" data-toggle="dropdown"> Personal </a> <div class="dropdown-menu"> <a class="dropdown-item" href="../web_pages/personal.html#software"> Software </a> <a class="dropdown-item" href="../web_pages/personal.html#hardware"> Hardware </a> <a class="dropdown-item" href="../web_pages/personal.html#video_games"> Video Games </a> <a class="dropdown-item" href="../web_pages/personal.html#podcasts"> Podcasts </a> <a class="dropdown-item" href="../web_pages/personal.html#music"> Music </a> </div> </li> <!-- Blog --> <li class="nav-item"> <a class="nav-link" href="../web_pages/blog.html"> Blog </a> </li> <!-- Documentation --> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" href="../web_pages/documentation.html" id="navbardrop" data-toggle="dropdown"> Documentation </a> <div class="dropdown-menu"> <a class="dropdown-item" href="../web_pages/documentation.html#introduction"> Introduction </a> <a class="dropdown-item" href="../web_pages/documentation.html#website_hosting"> Website Hosting </a> <a class="dropdown-item" href="../web_pages/documentation.html#web_design"> Web Design </a> <a class="dropdown-item" href="../web_pages/documentation.html#aesthetics"> Aesthetics </a> <a class="dropdown-item" href="../web_pages/documentation.html#inspiration"> Inspiration </a> </div> </li> </ul> </div> </nav>')

View File

@@ -1,67 +0,0 @@
/***********
* General *
***********/
body {
background-color: #E8EEF2;
padding-top: 65px;
font-family: Arial, Verdana, Tahoma, sans-serif;
}
/****************
* Main Content *
****************/
.my-nav {
background: #00274C;
font-size: 18px;
}
.my-nav .nav-link {
color: #FFCB05;
}
.my-nav .nav-link:hover {
color: #30C5FF;
}
.my-nav .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 39, 76, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.my-nav .navbar-toggler {
background: #FFCB05; /* pick your color */
}
.container-fluid {
color: #000000;
font-size: 18px;
}
.container-fluid h1 {
padding: 10px 10px;
background: #00274C;
color: #FFCB05;
}
.row {
/* border: 1px solid red; */
margin-bottom: 10px;
}
/* Add an invisible target before
anchor links so navbar doesn't
block content */
:target::before {
content: "";
display: block;
margin-top: -80px;
height: 80px;
width: 1px;
}
/* Side Padding */
@media (min-width: 768px) {
.px-md-6 {
padding-left: 12.5% !important;
padding-right: 12.5% !important;
}
}

View File

@@ -1,4 +1,7 @@
<!--Dummy File to Redirect to index.html in Web Pages Folder-->
<head>
<meta http-equiv="refresh" content="0; url=https://balajsra.github.io/web_pages/index.html">
</head>
<meta
http-equiv="refresh"
content="0; url=https://sravanbalaji.com/src/index.html"
/>
</head>

169
src/about.html Normal file
View File

@@ -0,0 +1,169 @@
<!DOCTYPE html>
<html lang="en" color-mode="light">
<head>
<script
language="javascript"
type="text/javascript"
src="common/header.txt"
></script>
<title>About</title>
</head>
<script
language="javascript"
type="text/javascript"
src="common/navbar.txt"
></script>
<body>
<div class="container-fluid px-md-6">
<!---------------------------------
BIO
----------------------------------->
<div id="bio">
<div class="row align-items-center">
<div class="col-md-12">
<h1><a name="bio">Bio</a></h1>
</div>
</div>
<div class="row align-items-center">
<div class="col-md-3">
<img
class="img-fluid mx-auto d-block"
src="./assets/about/profile_picture.jpg"
/>
</div>
<div class="col-md-9">
<p>
Sravan Balaji completed his undergraduate and graduate degrees at
the
<a href="https://umich.edu" target="_blank"
>University of Michigan, Ann Arbor</a
>. He earned dual B.S.E.'s in
<a href="https://me.engin.umich.edu/" target="_blank"
>Mechanical Engineering</a
>
and
<a href="https://cse.engin.umich.edu/" target="_blank"
>Computer Science</a
>
in December 2020 and an M.S. in
<a href="https://robotics.umich.edu/" target="_blank">Robotics</a>
in December 2021.
</p>
<p>
Sravan worked as a Graduate Navigation Intern at
<a href="https://www.mitre.org/" target="_blank">MITRE</a>
during summer 2021. You can learn more about this and his other
work experiences in the
<a href="./portfolio.html#professional_experience"
>professional experience</a
>
section of the
<a href="./portfolio.html">portfolio</a> page. He began working at
<a href="https://www.mitre.org/" target="_blank">MITRE</a>
in late January 2022 as an Associate Autonomous Systems Engineer
in McLean, VA.
</p>
<p>
Sravan's professional and academic interests are in controls,
motion planning, robotic perception & manipulation, autonomous &
connected vehicles, software development, and GNU/Linux among
other things. His personal interests include video games,
podcasts, music, cooking, football, soccer, formula 1, and
productivity software.
</p>
</div>
</div>
<div class="row align-items-center">
<div class="col-md-12">
<h1><a name="contact_me">Contact Me</a></h1>
</div>
</div>
<div class="row align-items-center">
<div class="col-md-12">
<p>
Feel free to reach out to me via email if you have any questions
about my website, college education, professional experience, or
anything else. If you have suggestions for the website or would
like to see the source files, check out my
<a
href="https://github.com/balajsra/sravanbalaji.com"
target="_blank"
>
GitHub repository</a
>. If you would like to connect with me on LinkedIn, use the link
below. I will do my best to respond to any communication in a
timely manner. Finally, check out my YouTube channel if you are
interested in some of the projects I have worked on.
</p>
</div>
</div>
</div>
<!---------------------------------
CONTACT ME
----------------------------------->
<div id="contact_me">
<div class="row align-items-center">
<div class="col-md-3 text-center">
<a href="mailto:balajsra@umich.edu" target="_blank">
<img
class="img-fluid mx-auto d-block"
alt="Email"
src="./assets/about/email.png"
/>
</a>
<p><br /><b>Email:</b> balajsra@umich.edu</p>
</div>
<div class="col-md-3 text-center">
<a
href="https://www.linkedin.com/in/sravan-balaji/"
target="_blank"
>
<img
class="img-fluid mx-auto d-block"
alt="LinkedIn"
src="./assets/about/linkedin.png"
/>
</a>
<p><br /><b>LinkedIn:</b> sravan-balaji</p>
</div>
<div class="col-md-3 text-center">
<a href="https://github.com/balajsra" target="_blank">
<img
class="img-fluid mx-auto d-block"
alt="GitHub"
src="./assets/about/github.png"
/>
</a>
<p><br /><b>GitHub:</b> balajsra</p>
</div>
<div class="col-md-3 text-center">
<a
href="https://www.youtube.com/channel/UC-xFJ4IKdogbpoQdQf2mgaA"
target="_blank"
>
<img
class="img-fluid mx-auto d-block"
alt="YouTube"
src="./assets/about/youtube.png"
/>
</a>
<p><br /><b>YouTube:</b> Sravan Balaji</p>
</div>
</div>
</div>
</div>
</body>
<footer>
<script
language="javascript"
type="text/javascript"
src="common/footer.txt"
></script>
</footer>
</html>

BIN
src/assets/about/email.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

BIN
src/assets/about/github.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.2 KiB

View File

Before

Width:  |  Height:  |  Size: 152 KiB

After

Width:  |  Height:  |  Size: 152 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 26 KiB

View File

Before

Width:  |  Height:  |  Size: 58 KiB

After

Width:  |  Height:  |  Size: 58 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.0 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.0 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.6 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.5 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.8 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.8 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 53 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 796 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

View File

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 15 KiB

View File

Before

Width:  |  Height:  |  Size: 16 KiB

After

Width:  |  Height:  |  Size: 16 KiB

View File

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 14 KiB

View File

Before

Width:  |  Height:  |  Size: 8.9 KiB

After

Width:  |  Height:  |  Size: 8.9 KiB

View File

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 12 KiB

View File

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

View File

Before

Width:  |  Height:  |  Size: 32 KiB

After

Width:  |  Height:  |  Size: 32 KiB

View File

Before

Width:  |  Height:  |  Size: 34 KiB

After

Width:  |  Height:  |  Size: 34 KiB

View File

Before

Width:  |  Height:  |  Size: 33 KiB

After

Width:  |  Height:  |  Size: 33 KiB

View File

Before

Width:  |  Height:  |  Size: 92 KiB

After

Width:  |  Height:  |  Size: 92 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 93 KiB

View File

Before

Width:  |  Height:  |  Size: 112 KiB

After

Width:  |  Height:  |  Size: 112 KiB

View File

Before

Width:  |  Height:  |  Size: 63 KiB

After

Width:  |  Height:  |  Size: 63 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 106 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 82 KiB

View File

Before

Width:  |  Height:  |  Size: 53 KiB

After

Width:  |  Height:  |  Size: 53 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 39 KiB

View File

Before

Width:  |  Height:  |  Size: 32 KiB

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 62 KiB

View File

Before

Width:  |  Height:  |  Size: 29 KiB

After

Width:  |  Height:  |  Size: 29 KiB

View File

Before

Width:  |  Height:  |  Size: 19 KiB

After

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.3 KiB

View File

Before

Width:  |  Height:  |  Size: 38 KiB

After

Width:  |  Height:  |  Size: 38 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 153 KiB

View File

Before

Width:  |  Height:  |  Size: 68 KiB

After

Width:  |  Height:  |  Size: 68 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 75 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 103 KiB

View File

Before

Width:  |  Height:  |  Size: 23 KiB

After

Width:  |  Height:  |  Size: 23 KiB

View File

Before

Width:  |  Height:  |  Size: 148 KiB

After

Width:  |  Height:  |  Size: 148 KiB

View File

@@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1024" height="1024" viewBox="0 0 1024 1024">
<path fill="#3a76f0" d="M0,0v1024h1024V0H0z"/>
<path fill="#ffffff" d="M427.5,170.3l7.9,32A319.6,319.6,0,0,0,347,238.9l-16.9-28.3A347.6,347.6,0,0,1,427.5,170.3Zm169,0-7.9,32A319.6,319.6,0,0,1,677,238.9l17.1-28.3A350.1,350.1,0,0,0,596.5,170.3ZM210.6,330a349.5,349.5,0,0,0-40.3,97.5l32,7.9A319.6,319.6,0,0,1,238.9,347ZM193,512a318.5,318.5,0,0,1,3.6-47.8l-32.6-5a352,352,0,0,0,0,105.5l32.6-4.9A319.5,319.5,0,0,1,193,512ZM693.9,813.3,677,785.1a317.8,317.8,0,0,1-88.3,36.6l7.9,32A350.3,350.3,0,0,0,693.9,813.3ZM831,512a319.5,319.5,0,0,1-3.6,47.8l32.6,4.9a352,352,0,0,0,0-105.5l-32.6,5A318.5,318.5,0,0,1,831,512Zm22.7,84.4-32-7.9A319,319,0,0,1,785.1,677l28.3,17A348.9,348.9,0,0,0,853.7,596.4Zm-293.9,231a319.1,319.1,0,0,1-95.6,0L459.3,860a351.3,351.3,0,0,0,105.4,0Zm209-126.2a318.1,318.1,0,0,1-67.6,67.5l19.6,26.6A355.1,355.1,0,0,0,795.4,721Zm-67.6-446a318.6,318.6,0,0,1,67.6,67.6L795.4,303A354.6,354.6,0,0,0,721,228.6Zm-446,67.6a318.6,318.6,0,0,1,67.6-67.6L303,228.6A354.6,354.6,0,0,0,228.6,303ZM813.4,330l-28.3,17a317.8,317.8,0,0,1,36.6,88.3l32-7.9A348.9,348.9,0,0,0,813.4,330ZM464.2,196.6a319.1,319.1,0,0,1,95.6,0l4.9-32.6a351.3,351.3,0,0,0-105.4,0ZM272.1,804.1,204,819.9l15.9-68.1-32.1-7.5-15.9,68.1a33,33,0,0,0,24.6,39.7,34.5,34.5,0,0,0,15,0l68.1-15.7Zm-77.5-89.2,32.2,7.4,11-47.2a316.2,316.2,0,0,1-35.5-86.6l-32,7.9a353.3,353.3,0,0,0,32.4,83.7Zm154,71.4-47.2,11,7.5,32.2,34.7-8.1a349,349,0,0,0,83.7,32.4l7.9-32a316.7,316.7,0,0,1-86.3-35.7ZM512,226c-158,.1-285.9,128.2-285.9,286.1a286.7,286.7,0,0,0,43.9,152L242.5,781.5,359.8,754c133.7,84.1,310.3,44,394.4-89.6S798.3,354.2,664.7,270A286.7,286.7,0,0,0,512,226s"/>
</svg>

After

Width:  |  Height:  |  Size: 1.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 63 KiB

View File

Before

Width:  |  Height:  |  Size: 155 KiB

After

Width:  |  Height:  |  Size: 155 KiB

View File

Before

Width:  |  Height:  |  Size: 107 KiB

After

Width:  |  Height:  |  Size: 107 KiB

View File

Before

Width:  |  Height:  |  Size: 18 KiB

After

Width:  |  Height:  |  Size: 18 KiB

View File

Before

Width:  |  Height:  |  Size: 30 KiB

After

Width:  |  Height:  |  Size: 30 KiB

View File

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 13 KiB

91
src/blog.html Normal file
View File

@@ -0,0 +1,91 @@
<!DOCTYPE html>
<html lang="en" color-mode="light">
<head>
<script
language="javascript"
type="text/javascript"
src="common/header.txt"
></script>
<title>Blog</title>
</head>
<script
language="javascript"
type="text/javascript"
src="common/navbar.txt"
></script>
<body>
<div class="container-fluid px-md-6">
<div class="row align-items-center">
<div class="col-md-12">
<h1>Blog Posts</h1>
</div>
</div>
<div class="row align-items-center">
<div class="col-md-3">
<div class="card">
<img
class="card-img-top"
src="./assets/hardware/oryx-pro-7.png"
alt="System76 Oryx Pro"
/>
<div class="card-body">
<h4 class="card-title">
<a href="blog_oryx_pro_review.html"
>System76 Oryx Pro 7 Review</a
>
</h4>
<p class="card-text">My review of the System76 Oryx Pro 7.</p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="card">
<img
class="card-img-top"
src="./assets/blog_posts/windows_to_linux/cover_windows_to_linux.jpeg"
alt="Windows to Linux"
/>
<div class="card-body">
<h4 class="card-title">
<a href="blog_windows_to_linux.html"
>Switching from Windows to Linux</a
>
</h4>
<p class="card-text">
A reflection on my journey from Windows to Linux.
</p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="card">
<img
class="card-img-top"
src="./assets/blog_posts/Docker/cover_docker.png"
alt="Docker Whale"
/>
<div class="card-body">
<h4 class="card-title">
<a href="blog_docker.html">Getting Started with Docker</a>
</h4>
<p class="card-text">
A brief introduction to docker, how to use it, and what you can
do with it.
</p>
</div>
</div>
</div>
</div>
</div>
</body>
<footer>
<script
language="javascript"
type="text/javascript"
src="common/footer.txt"
></script>
</footer>
</html>

377
src/blog_docker.html Normal file
View File

@@ -0,0 +1,377 @@
<!DOCTYPE html>
<html lang="en" color-mode="light">
<head>
<script
language="javascript"
type="text/javascript"
src="common/header.txt"
></script>
<title>Docker</title>
</head>
<script
language="javascript"
type="text/javascript"
src="common/navbar.txt"
></script>
<body>
<div class="container-fluid px-md-6">
<div class="row align-items-center">
<div class="col-md-2">
<!-- Nothing -->
</div>
<div class="col-md-8">
<!-- Title -->
<h1>Getting Started with Docker</h1>
<!-- Author & Date/Time -->
<p class="lead">Updated on March 18, 2020</p>
<!-- Preview Image -->
<div class="blog-cover">
<img
class="img-fluid rounded"
src="./assets/blog_posts/Docker/cover_docker.png"
alt=""
/>
</div>
<hr />
<!-- Post Content -->
<h2><a name="introduction">Introduction</a></h2>
<p>
Throughout my college career in computer science, I have found the
need to develop applications that will be deployed in a Linux
environment. When I previously used Windows 10 as my daily driver, I
have usually turned to a couple of different options: virtual
machines,
<a
href="https://docs.microsoft.com/en-us/windows/wsl/about"
target="_blank"
>Windows Subsystem for Linux</a
>, or <a href="https://www.cygwin.com" target="_blank">Cygwin</a>.
Recently, I discovered an alternative method for building and
testing Linux apps that is especially useful for collaboration and
deployment. Docker allows you to package an OS and all the necessary
dependencies into a <b>docker image</b>. You can then spin up an
instance of this image called a <b>docker container</b> in which you
can run your source code. Jake Wright's video was incredibly helpful
in my understanding of what docker is, how it's different from
virtual machines, and how to use it.
</p>
<div class="embed-responsive embed-responsive-16by9">
<iframe
class="embed-responsive-item"
src="https://www.youtube-nocookie.com/embed/YFl2mCHdv24"
allowfullscreen
></iframe>
</div>
<hr />
<h2><a name="installing_docker">Installing Docker</a></h2>
<p>
Depending on your host machine's operating system, you will install
one of the following Docker products. If you have macOS or Windows,
your first option should be Docker Desktop. Check if you meet the
system requirements. If you do not, Docker Toolbox is the legacy
option that uses Oracle VirtualBox rather than Hyper-V or HyperKit
for virtualization. For a computer with Windows 10 Home, you would
use Docker Toolbox for Windows. This blog post will discuss some
solutions to edge-case issues with Docker Toolbox that Docker
Desktop users will hopefully not have to deal with.
</p>
<ul>
<li>macOS</li>
<ul>
<li>
<a
href="https://docs.docker.com/docker-for-mac/install/"
target="_blank"
>Docker Desktop for Mac</a
>
</li>
<li>
<a
href="https://docs.docker.com/toolbox/toolbox_install_mac/"
target="_blank"
>Docker Toolbox for macOS</a
>
(Legacy)
</li>
</ul>
<li>Windows</li>
<ul>
<li>
<a
href="https://docs.docker.com/docker-for-windows/install/"
target="_blank"
>Docker Desktop for Windows</a
>
</li>
<li>
<a
href="https://docs.docker.com/toolbox/toolbox_install_windows/"
target="_blank"
>Docker Toolbox for Windows</a
>
(Legacy)
</li>
</ul>
<li>Linux</li>
<ul>
<li>
<a
href="https://docs.docker.com/install/linux/docker-ce/centos/"
target="_blank"
>Docker Engine - Community for CentOS</a
>
</li>
<li>
<a
href="https://docs.docker.com/install/linux/docker-ce/debian/"
target="_blank"
>Docker Engine - Community for Debian</a
>
</li>
<li>
<a
href="https://docs.docker.com/install/linux/docker-ce/fedora/"
target="_blank"
>Docker Engine - Community for Fedora</a
>
</li>
<li>
<a
href="https://docs.docker.com/install/linux/docker-ce/ubuntu/"
target="_blank"
>Docker Engine - Community for Ubuntu</a
>
</li>
</ul>
</ul>
<h3>Docker Toolbox & WSL</h3>
<p>
As mentioned previously, I am using Docker Toolbox since Windows 10
Home does not support Hyper-V for virtualization with Docker
Desktop. You can run docker toolbox in a command prompt or
powershell terminal, but I personally prefer to use WSL because I am
more familiar with bash terminal commands. If you are interested in
this setup, continue reading this section. Otherwise, you can skip
ahead.
</p>
<h4>Installing WSL</h4>
<p>
The default way to install WSL is through the
<a
href="https://docs.microsoft.com/en-us/windows/wsl/about"
target="_blank"
>Microsoft Store</a
>. This will install WSL on your system drive (e.g. C:\). If you are
like me and don't want to install it on your system drive, follow
the instructions
<a
href="https://kontext.tech/column/tools/308/how-to-install-windows-subsystem-for-linux-on-a-non-c-drive"
target="_blank"
>here</a
>.
</p>
<h4>Setting Up Docker Toolbox with WSL</h4>
<p>
After installing WSL, follow the instructions in
<a
href="https://medium.com/@joaoh82/setting-up-docker-toolbox-for-windows-home-10-and-wsl-to-work-perfectly-2fd34ed41d51"
target="_blank"
>Setting Up Docker Toolbox for Windows Home 10 and WSL to Work
Perfectly!</a
>
starting with
<b>Install Docker and Docker Compose within WSL</b>. As you will
have seen near the end of that post, there are some extra steps
needed to ensure that volume mounts work. After setting
<code>root = /</code>, you will need to configure shared folders for
the <code>default</code> docker machine in VirtualBox.
</p>
<h4>Shared Folder Configuration for Volume Mounting</h4>
<p>
I configured all of my drives as shared folders so I can mount any
folders on my host machine to any docker containers I run. In your
WSL terminal, run
<code>docker-machine.exe start</code> to start the
<code>default</code> docker machine created by the Docker Quickstart
Terminal. After your docker machine is running, open the shared
folder settings as shown in
<a
href="https://medium.com/@Charles_Stover/fixing-volumes-in-docker-toolbox-4ad5ace0e572"
target="_blank"
>Fixing Volumes in Docker Toolbox</a
>. The image below shows how <code>C:\</code> on my host computer is
mounted at <code>/</code> in folder <code>c</code> on my docker
machine such that <code>C:\</code> maps to <code>/c</code>. Make
sure you have enabled <code>Auto-mount</code> and
<code>Make Permanent</code>. Click <b>OK</b> to save all settings,
then go back to the WSL terminal and run
<code>docker-machine.exe restart default</code>. Now your docker
machine should be properly configured to allow volume mounting.
</p>
<img
class="img-fluid mx-auto d-block"
src="./assets/blog_posts/Docker/virtual_box_shared_folder.jpg"
/>
<h4>Increase Docker Machine Resources</h4>
<p>
One issue I ran into with the default settings for the
<code>default</code> docker machine is the amount of RAM allocated
to it. I attempted to build the
<a href="https://github.com/borglab/gtsam" target="_blank">GTSAM</a>
library inside a docker container and ran into an
<i>internal compiler error: Killed (program cc1plus)</i>. As
mentioned
<a
href="https://github.com/docker/for-win/issues/403"
target="_blank"
>here</a
>, the solution is to increase the RAM allocated to the docker
machine in VirtualBox. In the WSL terminal, run
<code>docker-machine.exe stop</code> to shutdown the docker machine.
When this is complete, right click on the
<code>default</code> docker machine in VirtualBox and open
<b>Settings</b>. In the <b>System</b> tab, increase
<i>Base Memory</i>. Similar to virtual machines, I would not
recommend allocating more than half of your system's RAM. For
example, my computer has 16 GB of RAM, so I would only recommend
allocating up to 8 GB of RAM to the docker machine. You can look
through the other options, such as number of allocated processor
cores, as well if you wish.
</p>
<hr />
<h2>
<a name="building_images_and_running_containers"
>Building Images & Running Containers</a
>
</h2>
<p>
To learn about Dockerfiles and a basic example, check out the video
in the
<a href="#introduction">introduction</a>. To learn about Docker
Compose, check out Jake Wright's video on the topic.
</p>
<div class="embed-responsive embed-responsive-16by9">
<iframe
class="embed-responsive-item"
src="https://www.youtube-nocookie.com/embed/Qw9zlE3t8Ko"
allowfullscreen
></iframe>
</div>
<hr />
<h2>
<a name="x_forwarding">X Forwarding for GUI Applications</a>
</h2>
<p>
In a virtual machine, you can easily run GUI applications such as a
web browser, text editor, etc. In a docker container, the process is
a little bit different. You will need to download an X Server such
as
<a href="https://sourceforge.net/projects/vcxsrv/" target="_blank"
>VcXsrv Windows X Server</a
>.
</p>
<p>
<a
href="https://dev.to/darksmile92/run-gui-app-in-linux-docker-container-on-windows-host-4kde"
target="_blank"
>Run GUI app in linux docker container on windows host</a
>
provides a great explanation of why you would want to do this and
how to run your docker container. The post discusses how to set your
IP address as the
<code>DISPLAY</code> environment variable that is passed to docker
via the <code>-e DISPLAY=$DISPLAY</code> command line argument. You
can alternatively pass your IP address as an environment variable in
your docker compose file. This is shown in
<a
href="https://github.com/MAAV-Software/ros-tutorial"
target="_blank"
>MAAV's ROS Tutorial</a
>
(reproduced below). The main settings to look at below are
<code>environment</code> and <code>network_mode</code>. Set the
<code>DISPLAY</code> environment variable to
<code>[ip_address]:0.0</code> and set
<code>network_mode: "host"</code>.
</p>
<pre>
<code class="yml">
# docker-compose.yml
version: "2"
services:
ros-demo:
image: ros-demo
privileged: true
volumes:
# Mount the current directory do everything in /tutorial within docker
- .:/tutorial:rw
environment:
- DISPLAY=1.1.1.1:0.0 # Change 1.1.1.1 to your IP Address
network_mode: "host"
container_name: ros-demo
command: "/bin/bash --init-file scripts/source-ros.sh" #source ros automatically
</code>
</pre>
<hr />
<h2>
<a name="helpful_commands">Helpful Docker Commands</a>
</h2>
<ul>
<li>System Prune to clear space on Docker Machine</li>
<ul>
<li><code>docker system prune --volumes</code></li>
</ul>
</ul>
<hr />
<h2><a name="conclusion">Conclusion</a></h2>
<p>
Hopefully by this point, you have a better understanding of what
docker is, why you might want to use it, and how to get a docker
machine setup so you can build and run docker containers. If you
have any questions or suggestions for improvement, feel free to
<a href="./about.html#contact_me">contact me</a>.
</p>
<hr />
</div>
<div class="col-md-2">
<!-- Nothing -->
</div>
</div>
</div>
</body>
<footer>
<script
language="javascript"
type="text/javascript"
src="common/footer.txt"
></script>
</footer>
</html>

View File

@@ -0,0 +1,490 @@
<!DOCTYPE html>
<html lang="en" color-mode="light">
<head>
<script
language="javascript"
type="text/javascript"
src="common/header.txt"
></script>
<title>System76 Oryx Pro 7 Review</title>
</head>
<script
language="javascript"
type="text/javascript"
src="common/navbar.txt"
></script>
<body>
<div class="container-fluid px-md-6">
<div class="row align-items-center">
<div class="col-md-2">
<!-- Nothing -->
</div>
<div class="col-md-8">
<!-- Title -->
<h1>System76 Oryx Pro 7 Review</h1>
<!-- Author & Date/Time -->
<p class="lead">Updated on July 1, 2022</p>
<!-- Preview Image -->
<div class="blog-cover">
<img
class="img-fluid rounded"
src="./assets/hardware/oryx-pro-7.png"
alt="System76 Oryx Pro"
/>
</div>
<hr />
<!-- Post Content -->
<h2>
<a name="system-specifications">System Specifications</a>
</h2>
<h3>Oryx Pro 7 Configuration</h3>
<p>
See the
<a
href="https://tech-docs.system76.com/models/oryp7/README.html"
target="_blank"
>System76 Technical Documentation</a
>
for more information.
</p>
<ul>
<li><b>OS</b>: Pop!_OS 20.10 (64-bit) with full disk-encryption</li>
<li>
<b>CPU</b>: 5 GHz i7-10870H (2.2 up to 5.0 GHz - 16MB Cache - 8
Cores -16 Threads)
</li>
<li><b>GPU</b>: 8 GB RTX 3070 w/ 5888 CUDA Cores</li>
<li><b>Memory</b>: 8 GB Single Channel DDR4 at 2933 MHz</li>
<li>
<b>Storage</b>: 240 GB Seq Read: 540 MB/s, Seq Write: 465 MB/s
</li>
<li><b>Display</b>: 15.6" 1920x1080@144Hz LCD</li>
<li><b>Warranty</b>: 2 Year Limited Parts and Labor Warranty</li>
<li>
<b>Link</b>:
<a href="https://system76.com/laptops/oryx" target="_blank"
>System76 Website</a
>
</li>
<li><b>Price</b>: $2,209.47</li>
</ul>
<h3>Additional Parts</h3>
<h4>Storage</h4>
<ul>
<li><b>Model</b>: Samsung 970 EVO Plus M.2 NVMe SSD</li>
<li><b>Size</b>: 2TB</li>
<li>
<b>Link</b>:
<a
href="https://www.amazon.com/gp/product/B07MFZXR1B/ref=ppx_od_dt_b_asin_title_s01?ie=UTF8&psc=1"
target="_blank"
>Amazon</a
>
</li>
<li><b>Price</b>: $319.99</li>
</ul>
<h4>RAM</h4>
<ul>
<li>
<b>Model</b>: HyperX Impact DDR4 CL17 SODIMM Memory (Kit of 2)
</li>
<li><b>Size</b>: 32GB</li>
<li><b>Speed</b>: 2933MHz</li>
<li>
<b>Link</b>:
<a
href="https://www.amazon.com/gp/product/B07BGLBZBK/ref=ppx_od_dt_b_asin_title_s00?ie=UTF8&psc=1"
target="_blank"
>Amazon</a
>
</li>
<li><b>Price</b>: $219.00</li>
</ul>
<hr />
<h2><a name="upgradeability">Upgradeability</a></h2>
<p>
I ended up purchasing the Oryx Pro 7 with base memory and storage in
March of 2021, then upgraded these components with parts I bought
from Amazon. The upgrade experience was pretty good. Removing the
bottom cover just involves removing a bunch of screws, nothing too
difficult. I had a little trouble with this because one of the
screws seemed to get stuck, but I eventually got it out. The
<a
href="https://tech-docs.system76.com/models/oryp7/repairs.html"
target="_blank"
>Parts & Repairs guide</a
>
was very clear and helpful in this regard.
</p>
<hr />
<h2>
<a name="experimenting-with-linux-distros"
>Experimenting with Linux Distros</a
>
</h2>
<p>
I initially decided to give
<a href="https://pop.system76.com/" target="_blank">Pop!_OS</a> a
chance since it came pre-installed on the Oryx Pro and was developed
by System76. My experience was very positive. I'm really happy that
System76 and Pop!_OS have come up with a good and reliable solution
for switching between the integrated graphics and discrete NVIDIA
graphics. Being able to just click on the option in the GNOME menu
is so useful. The window management in Pop!_OS's
<a href="https://github.com/pop-os/cosmic" target="_blank"
>COSMIC</a
>
desktop environment is very good too. Coming from a standalone
tiling window manager like dwm, I found that this provides a pretty
good balance between convenience and usability.
</p>
<p>
After some more time with Pop!_OS, I realized that I really missed
the package management, customizability, and rolling release of
Arch. For the longest time, I couldn't get Arch working reliably, so
I decided to try some other Arch based distros like
<a href="https://manjaro.org/" target="_blank">Manjaro</a>
and
<a href="https://garudalinux.org/" target="_blank">Garuda</a>. With
both of these, I found that switchable graphics (via the
<a
href="https://aur.archlinux.org/packages/system76-power/"
target="_blank"
>system76-power AUR package</a
>) works very well. I eventually decided on Garuda because it
implements a lot of the customizations I usually do in my vanilla
Arch installs anyways (e.g., btrfs, zen kernel, chaotic-aur, backups
w/ timeshift, easy options to enable gaming tweaks, etc.).
</p>
<p>
Later, I started noticing some issues with suspending and
hibernating as well as switching graphics. I couldn't rely on my
laptop to stay awake or suspend when I expected it to. Sometimes the
computer would just freeze up randomly and I would need to hard
reboot. It seemed that there was something interfering with the
graphics card. This is when I noticed that the
<a
href="https://wiki.archlinux.org/title/System76_Oryx_Pro"
target="_blank"
>Oryx Pro ArchWiki page</a
>
had been updated and I noticed an
<a
href="https://github.com/pop-os/system76-power/issues/299"
target="_blank"
>issue on GitHub</a
>. These finally led me to a stable install with Arch Linux.
</p>
<p>
Install the following packages from the
<a href="https://aur.archlinux.org/" target="_blank">AUR</a>:
</p>
<ul>
<li>system76-dkms</li>
<li>system76-acpi-dkms</li>
<li>system76-io-dkms</li>
<li>system76-driver</li>
<li>system76-power</li>
<li>system76-firmware-daemon</li>
<li>system76-firmware</li>
<li>firmware-manager</li>
</ul>
<p>
Then add your user to the <code>adm</code> group and enable the
following services:
</p>
<ul>
<li><code>sudo gpasswd -a $USER adm</code></li>
<li><code>sudo systemctl enable --now system76</code></li>
<li>
<code>sudo systemctl enable --now system76-firmware-daemon</code>
</li>
<li>
<code
>sudo systemctl enable --now
com.system76.PowerDaemon.service</code
>
</li>
</ul>
<p>
Finally, disable the Power Profiles Daemon which was interfering
with system76-power and enable the NVIDIA services for suspending
(and optionally hibernating & resuming if you want that):
</p>
<ul>
<li><code>sudo systemctl mask power-profiles-daemon</code></li>
<li>
<code
>sudo systemctl enable nvidia-{suspend,resume,hibernate}</code
>
</li>
</ul>
<p>
To get the speakers working, you will probably need to create a file
called <code>/etc/modprobe.d/clevo-p950.conf</code> and put the
following inside:
<code>options snd-hda-intel model=clevo-p950</code>.
</p>
<p>
If you encounter any other issues, be sure to check out the
<a
href="https://wiki.archlinux.org/title/System76_Oryx_Pro"
target="_blank"
>Oryx Pro ArchWiki page</a
>.
</p>
<p>
Now your laptop should be able to run Arch with all the same
graphics switching goodness and functional speakers of Pop!_OS
without any of the random freezing or crashing!
</p>
<hr />
<h2><a name="pros-and-cons">Pros and Cons</a></h2>
<h3>Pros</h3>
<ul>
<li>
The display is really good, I am highly satisfied with it.
Everything is just so much smoother in 144Hz.
</li>
<li>
Keyboard is not bad at all, but it definitely doesn't match up in
terms of quality and satisfaction to the excellent HP Spectre x360
keyboard that I used previously. I really don't mind it though and
love that it includes a full sized number pad. The layout doesn't
feel cramped and it has plenty of keys that can be customized via
the
<a
href="https://github.com/pop-os/keyboard-configurator"
target="_blank"
>keyboard configurator</a
>.
</li>
<li>
Gaming performance is amazing! I can run Yakuza: Like a Dragon at
around 70 or 80 fps with all the settings turned up to the max. I
love that I can use my favorite operating system without having to
compromise too much on gaming performance.
</li>
<li>
Love the keyboard backlighting and color changing on the fly.
Would love to be able to customize this further in software
though.
</li>
<li>
When I need a mouse, I tend to use an external one, but the
trackpad feels excellent to me. My finger just glides across the
super smooth surface. I think the overall trackpad size is good as
well. Not as large as one you would find on a Macbook, but
definitely good enough for my use cases.
</li>
<li>
It was a bit more difficult than I expected to remove the bottom
plate when upgrading the RAM and storage, but overall a very easy
process. Really appreciate the focus on upgradeability in the
hardware design.
</li>
<li>
I absolutely love the port selection. No need to live the dongle
life when the laptop has so many built-in already.
</li>
<li>
The build quality is pretty solid. It definitely feels like a
premium device.
</li>
</ul>
<h3>Cons</h3>
<ul>
<li>
Speakers are really sub-par. I understand that System76 doesn't
design the hardware, but this was my main disappointment. I have
external bookshelf speakers and bluetooth headphones I can use, so
this isn't an unsolvable problem, but just generally annoying.
</li>
<li>
Webcam is functional, but not good at all. Definitely need to use
an external webcam for video calls.
</li>
<li>
The microphone has a strange oscillatory behavior where there is
some buzzing sound that increases and decreases regularly.
Additionally, you can really hear the fans ramping up and down in
the mic, makes it difficult to have a meeting if you use the
integrated mic and the fans suddenly turn on. Definitely need an
external mic.
</li>
<li>
Battery life is really bad when the discrete graphics card is on
(as expected). Maybe a little more than an hour a time, sometimes
more depending on how willing I am to lower CPU frequency and
stuff. As a desktop replacement type laptop, that is to be
expected through.
</li>
<li>
Fans can get really loud at times, especially when pushing the GPU
in games. I often have to turn up my speakers or wear noise
cancelling headphones. This is an understandable physical
limitation of thin and light gaming laptops though.
</li>
<li>
While the display itself is great, I really wish the hinge would
rotate farther back. It looks like the screen can only rotate
about 120 degrees from fully closed, so getting a good viewing
angle (especially when the laptop is propped up or really low) can
be difficult.
</li>
</ul>
<hr />
<h2><a name="conclusions">Conclusions</a></h2>
<p>
It may seem that the cons outweigh the pros, but this is only
because I am really nitpicking. The things this laptop gets right
(e.g., gaming, refresh rate, switchable graphics, general
performance) are much more important to me than the other things
(e.g., mic / webcam quality). Regarding price, you are definitely
paying a premium for first-class linux support, but it is well worth
it in my opinion. I do not want to use Windows anymore and I am
happy to pay extra if it means supporting a company that promotes
and sells Linux computers and having a device that can be easily
upgraded down the line. Overall, I am very happy with my purchase.
Especially now that I have a stable installation of Arch Linux that
has all the functionality I expect without random freezing or
crashing.
</p>
<hr />
<h2><a name="images">Images</a></h2>
<p>
These are some images from when I unboxed the laptop, installed the
RAM & SSD, and customized my setup a little.
</p>
<div class="container-fluid">
<div class="row align-items-center">
<div class="col-md-4">
<img
class="img-fluid rounded"
src="./assets/blog_posts/oryx_pro_review/01_oryp7.jpg"
alt=""
/>
</div>
<div class="col-md-4">
<img
class="img-fluid rounded"
src="./assets/blog_posts/oryx_pro_review/02_oryp7.jpg"
alt=""
/>
</div>
<div class="col-md-4">
<img
class="img-fluid rounded"
src="./assets/blog_posts/oryx_pro_review/03_oryp7.jpg"
alt=""
/>
</div>
</div>
<div class="row align-items-center">
<div class="col-md-4">
<img
class="img-fluid rounded"
src="./assets/blog_posts/oryx_pro_review/04_oryp7.jpg"
alt=""
/>
</div>
<div class="col-md-4">
<img
class="img-fluid rounded"
src="./assets/blog_posts/oryx_pro_review/05_oryp7.jpg"
alt=""
/>
</div>
<div class="col-md-4">
<img
class="img-fluid rounded"
src="./assets/blog_posts/oryx_pro_review/06_oryp7.jpg"
alt=""
/>
</div>
</div>
<div class="row align-items-center">
<div class="col-md-4">
<img
class="img-fluid rounded"
src="./assets/blog_posts/oryx_pro_review/07_oryp7.jpg"
alt=""
/>
</div>
<div class="col-md-4">
<img
class="img-fluid rounded"
src="./assets/blog_posts/oryx_pro_review/08_oryp7.jpg"
alt=""
/>
</div>
<div class="col-md-4">
<img
class="img-fluid rounded"
src="./assets/blog_posts/oryx_pro_review/09_oryp7.jpg"
alt=""
/>
</div>
</div>
<div class="row align-items-center">
<div class="col-md-6">
<img
class="img-fluid rounded"
src="./assets/blog_posts/oryx_pro_review/10_oryp7.jpg"
alt=""
/>
</div>
<div class="col-md-6">
<img
class="img-fluid rounded"
src="./assets/blog_posts/oryx_pro_review/11_oryp7.jpg"
alt=""
/>
</div>
</div>
</div>
<hr />
</div>
<div class="col-md-2">
<!-- Nothing -->
</div>
</div>
</div>
</body>
<footer>
<script
language="javascript"
type="text/javascript"
src="common/footer.txt"
></script>
</footer>
</html>

View File

@@ -0,0 +1,350 @@
<!DOCTYPE html>
<html lang="en" color-mode="light">
<head>
<script
language="javascript"
type="text/javascript"
src="common/header.txt"
></script>
<title>Switching from Windows to Linux</title>
</head>
<script
language="javascript"
type="text/javascript"
src="common/navbar.txt"
></script>
<body>
<div class="container-fluid px-md-6">
<div class="row align-items-center">
<div class="col-md-2">
<!-- Nothing -->
</div>
<div class="col-md-8">
<!-- Title -->
<h1>Switching from Windows to Linux</h1>
<!-- Author & Date/Time -->
<p class="lead">Updated on July 1, 2022</p>
<!-- Preview Image -->
<div class="blog-cover">
<img
class="img-fluid rounded"
src="./assets/blog_posts/windows_to_linux/cover_windows_to_linux.jpeg"
alt="Windows to Linux"
/>
</div>
<hr />
<!-- Post Content -->
<h2><a name="introduction">Introduction</a></h2>
<p>
Around the summer of 2020, I started experimenting with Linux to see
if it could replace Windows as my daily driver operating system. I
had a little bit of experience with
<a
href="https://www.redhat.com/en/technologies/linux-platforms/enterprise-linux"
target="_blank"
>Red Hat Enterprise Linux</a
>
and
<a href="https://ubuntu.com" target="_blank">Ubuntu</a>
through my Computer Science course work, but I had never really used
it as my daily driver desktop / laptop operating system. I really
wanted to see if it could handle development, general productivity,
and gaming.
</p>
<h3>Development</h3>
<p>
Development is definitely where Linux shines because of its superior
package management. For example, Ubuntu (and its derivatives) use
the <code>apt</code> package manager which allows you to easily
install most development packages like Python, gcc, Git, etc. On
Windows, you have to go to a website, click on a download link, run
an executable, and walk through the steps in an installer. On Linux,
it is as simple as a couple terminal commands. There's a reason even
Microsoft felt it needed to improve the developer experience on
Windows via the
<a
href="https://docs.microsoft.com/en-us/windows/wsl/install-win10"
target="_blank"
>Windows Subsystem for Linux</a
>.
</p>
<h3>Productivity</h3>
<p>
General productivity is no different on Linux than Windows, other
than the lack of Microsoft Office and some proprietary software like
Adobe's products. This wasn't a big deal for me because there are
plenty of free and open-source alternatives as well as web-based
options if I ever needed to write documents, create presentations,
edit pictures, etc. If you rely on software that only works on
Windows for daily productivity work, you might want to look into
free and open-source alternatives before switching to Linux.
</p>
<h3>Gaming</h3>
<p>
Gaming was really the main concern I had when thinking about moving
away from Windows. Luckily, there has been a lot of progress on this
front in recent years. Per
<a href="https://www.protondb.com" target="_blank">ProtonDB</a>:
</p>
<blockquote cite="https://www.protondb.com">
"Proton is a new tool released by Valve Software that has been
integrated with Steam Play to make playing Windows games on Linux as
simple as hitting the Play button within Steam. Underneath the hood,
Proton comprises other popular tools like Wine and DXVK among others
that a gamer would otherwise have to install and maintain
themselves. This greatly eases the burden for users to switch to
Linux without having to learn the underlying systems or losing
access to a large part of their library of games. Proton is still in
its infancy so support is inconsistent, but regularly improving."
</blockquote>
<p>
Looking at ProtonDB, a lot of the games I play (mostly
single-player) have gold or above ratings, meaning they generally
work by just pressing the play button, possibly with a few tweaks.
After trying this out myself, I have come to the same conclusion.
Gaming on Linux is as good as it has ever been and will only get
better, especially after the launch of the SteamOS 3.0 powered
<a href="https://store.steampowered.com/steamdeck" target="_blank"
>Steam Deck</a
>
from Valve.
</p>
<p>
If you play a lot of online multiplayer games, you may need to wait.
Not all anti-cheat software currently works through Proton.
<a href="https://areweanticheatyet.com" target="_blank"
>Are We Anti-Cheat Yet?</a
>
provides "a comprehensive and crowd-sourced list of games using
anti-cheats and their compatibility with GNU/Linux or Wine/Proton".
<a href="https://www.ea.com/games/apex-legends" target="_blank"
>Apex Legends</a
>
is one notable example that enabled Linux support for Easy
Anti-Cheat shortly after the launch of the Steam Deck.
</p>
<hr />
<h2><a name="distro-hopping">Distro Hopping</a></h2>
<p>
After trying out a bunch of distros like
<a href="https://ubuntu.com" target="_blank">Ubuntu</a>,
<a href="https://pop.system76.com" target="_blank">Pop!_OS</a>, and
<a href="https://getfedora.org" target="_blank">Fedora</a>, I
eventually landed on
<a href="https://archlinux.org" target="_blank">Arch Linux</a>. As
someone who likes to tinker with their computer a lot, Arch felt
like the best option because I could literally build my OS from the
ground up. I essentially have complete control over which packages
get installed on my system. This means there is a steep learning
curve and things can break if you are not careful. If you can get
over the initial difficulties, you will find an amazing Linux
desktop experience. The main reasons I decided on Arch are:
</p>
<ul>
<li>
<b>Rolling Release</b>: I don't have to re-install my OS every 6
months. My system and the kernel get updated through a simple
package manager command.
</li>
<li>
<b>Package Management</b>: Pacman and AUR helpers (e.g.
<a href="https://github.com/Morganamilo/paru" target="_blank"
>paru</a
>) are by far the best package management solution I have seen in
Linux. Pretty much any piece of software you might want to use is
available in either the
<a href="https://archlinux.org/packages/" target="_blank"
>main Arch repos</a
>
or the
<a href="https://aur.archlinux.org" target="_blank">AUR</a>. I
wanted my packages to be up to date without relying on universal
package formats like
<a href="https://snapcraft.io" target="_blank">snap</a>,
<a href="flathub" target="_blank">flatpak</a>, or
<a href="https://appimage.org" target="_blank">AppImage</a>. While
these universal package formats are great in that they can run on
any Linux distro, they don't integrate into the system as well as
I would like. AppImages have to be updated manually and don't
integrate well with the desktop experience by default. Flatpaks
are sandboxed applications, which means they require manual
intervention to access certain parts of the OS. The main issue I
found here was with theming. For lots of open source applications,
they may not have a snap, flatpak, or AppImage package, but they
almost always have an AUR package. This means it is extremely rare
to have to manually install any application or program on my
system.
</li>
<li>
<b>ArchWiki</b>: The
<a href="https://wiki.archlinux.org/" target="_blank">ArchWiki</a>
is by far the best source of linux documentation I have found on
the internet. It has clear and well written information on pretty
much any topic you may be interested in and any issue you may
encounter. On other distros, you generally have to resolve issues
yourself or search for solutions on random message boards without
really understanding what the different components of your OS do.
By reading the ArchWiki, I feel like I have gained a much better
understanding of how my computer works and how to approach
resolving any issues I may have.
</li>
</ul>
<p>
After running Arch on my gaming desktop and ultrabook laptop for
around a year, I decided to buy a Linux gaming laptop. I wanted to
have one system that I could get work done and play games on. After
doing some research, I landed on the
<a href="https://system76.com/laptops/oryx" target="_blank"
>System76 Oryx Pro 7</a
>
because it is made by a U.S. based company with excellent customer
service and has first-class Linux support. System76 also makes
Pop!_OS, which I tried for a couple of weeks, but I just had to go
back to Arch for the reasons mentioned above. Luckily, the ArchWiki
has a
<a
href="https://wiki.archlinux.org/title/System76_Oryx_Pro"
target="_blank"
>page for the System76 Oryx Pro</a
>. By following the suggestions there, I was able to resolve issues
like the audio not working, graphics switching, suspend/hibernate,
etc.
</p>
<hr />
<h2>
<a name="desktop-environments">Desktop Environments</a>
</h2>
<p>
While I was in the process of switching between Linux distros, I was
also switching between desktop environments. I was most familiar
with
<a href="https://www.gnome.org" target="_blank">GNOME</a>
from Ubuntu and Red Hat Enterprise Linux (RHEL), but it felt kind of
slow and lacked customizability. This is when I discovered
<a href="https://kde.org" target="_blank">KDE Plasma</a>. Coming
from Windows, I was much more comfortable with the look and feel of
KDE Plasma. Additionally, it has many (perhaps too many)
customizability options. After using this for a while, I eventually
felt that I wanted something more minimal that I could tweak exactly
to my liking.
</p>
<hr />
<h2><a name="window-managers">Window Managers</a></h2>
<p>
This is when I learned about window managers from YouTubers like
<a
href="https://www.youtube.com/channel/UCVls1GmFKf6WlTraIb_IaJg"
target="_blank"
>DistroTube</a
>. Desktop environments are generally a combination of a window
manager and a bunch of utility programs and pre-installed apps. A
standalone window manager just controls where windows show up on
your screen and the decorations that appear around them. The most
suggested window manager for beginners is generally
<a href="https://i3wm.org" target="_blank">i3</a>. This is a tiling
window manager with a configuration file that is written in an easy
to use syntax. I tried i3 for a while, but it never really stuck, so
I went back to KDE Plasma. After doing some more research, I
eventually landed on
<a href="https://dwm.suckless.org" target="_blank">dwm</a>. Given my
experience with C/C++, this seemed like a better window manager for
my needs. One of the main downsides of dwm is that it is meant to be
super minimal where features you might expect to see need to be
added through patches. The process of patching can be slow,
annoying, and prone to error. A great solution to this problem is
<a href="https://github.com/bakkeby/dwm-flexipatch" target="_blank"
>dwm-flexipatch</a
>. This includes a bunch of commonly used patches that can be
enabled or disabled very easily. You can see my configuration of
dwm-flexipatch on
<a href="https://github.com/balajsra/dwm-flexipatch" target="_blank"
>GitHub</a
>.
</p>
<hr />
<h2><a name="current-setup">Current Setup</a></h2>
<p>
My
<a href="https://github.com/balajsra/dotfiles" target="_blank"
>current setup</a
>
involves these main components:
</p>
<ul>
<li>
<b>Window Manager</b>:
<a
href="https://github.com/bakkeby/dwm-flexipatch"
target="_blank"
>dwm-flexipatch</a
>
</li>
<li>
<b>Status Bar</b>:
<a href="https://github.com/polybar/polybar" target="_blank"
>polybar</a
>
</li>
<li>
<b>Terminal</b>:
<a href="https://sw.kovidgoyal.net/kitty/" target="_blank"
>kitty</a
>
</li>
<li>
<b>Color Theme</b>:
<a href="https://draculatheme.com" target="_blank">Dracula</a>
/
<a href="https://draculatheme.com/pro" target="_blank"
>Dracula Pro</a
>
</li>
<li>
<b>Application Launcher</b>:
<a href="https://github.com/davatorium/rofi" target="_blank"
>Rofi</a
>
</li>
</ul>
<p>
<img
class="img-fluid rounded"
src="./assets/blog_posts/windows_to_linux/dwm_flexipatch_screenshot.png"
alt="dwm flexipatch desktop setup"
/>
</p>
<hr />
</div>
<div class="col-md-2">
<!-- Nothing -->
</div>
</div>
</div>
</body>
<footer>
<script
language="javascript"
type="text/javascript"
src="common/footer.txt"
></script>
</footer>
</html>

Some files were not shown because too many files have changed in this diff Show More