544 lines
17 KiB
HTML
544 lines
17 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en-us">
|
|
<head><script src="/livereload.js?mindelay=10&v=2&port=1313&path=livereload" data-no-instant defer></script>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
|
|
|
<title>My New Hugo Site</title>
|
|
<meta name="viewport" content="width=device-width,minimum-scale=1">
|
|
<meta name="description" content="">
|
|
<meta name="generator" content="Hugo 0.145.0">
|
|
|
|
|
|
|
|
<meta name="robots" content="noindex, nofollow">
|
|
|
|
|
|
|
|
|
|
<link rel="stylesheet" href="/ananke/css/main.min.css" >
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<link href="/programming/index.xml" rel="alternate" type="application/rss+xml" title="My New Hugo Site" />
|
|
<link href="/programming/index.xml" rel="feed" type="application/rss+xml" title="My New Hugo Site" />
|
|
|
|
|
|
|
|
|
|
<link rel="canonical" href="http://localhost:1313/programming/">
|
|
|
|
|
|
<meta property="og:url" content="http://localhost:1313/programming/">
|
|
<meta property="og:site_name" content="My New Hugo Site">
|
|
<meta property="og:title" content="Programmings">
|
|
<meta property="og:locale" content="en_us">
|
|
<meta property="og:type" content="website">
|
|
|
|
<meta itemprop="name" content="Programmings">
|
|
<meta name="twitter:card" content="summary">
|
|
<meta name="twitter:title" content="Programmings">
|
|
|
|
|
|
</head><body class="ma0 avenir bg-near-white development">
|
|
|
|
|
|
|
|
<header>
|
|
<div class="pb3-m pb6-l bg-black">
|
|
<nav class="pv3 ph3 ph4-ns" role="navigation">
|
|
<div class="flex-l justify-between items-center center">
|
|
<a href="/" class="f3 fw2 hover-white no-underline white-90 dib">
|
|
|
|
My New Hugo Site
|
|
|
|
</a>
|
|
<div class="flex-l items-center">
|
|
|
|
|
|
|
|
<div class="ananke-socials"></div>
|
|
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<div class="tc-l pv3 ph3 ph4-ns">
|
|
<h1 class="f2 f-subheadline-l fw2 light-silver mb0 lh-title">
|
|
Programmings
|
|
</h1>
|
|
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
|
|
<main class="pb7" role="main">
|
|
|
|
<article class="pa3 pa4-ns nested-copy-line-height">
|
|
<section class="cf ph3 ph5-l pv3 pv4-l f4 tc-l center measure-wide lh-copy mid-gray"></section>
|
|
<section class="flex-ns flex-wrap justify-around mt5">
|
|
|
|
<div class="relative w-100 w-30-l mb4 bg-white">
|
|
<div class="relative w-100 mb4 bg-white nested-copy-line-height">
|
|
<div class="bg-white mb3 pa4 gray overflow-hidden">
|
|
<span class="f6 db">Programmings</span>
|
|
<h1 class="f3 near-black">
|
|
<a href="/programming/embedded/inventory/" class="link black dim">
|
|
|
|
</a>
|
|
</h1>
|
|
<div class="nested-links f5 lh-copy nested-copy-line-height">
|
|
<h1 id="inventory">Inventory</h1>
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th style="text-align: left">Qty</th>
|
|
<th style="text-align: left">Item</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td style="text-align: left">2</td>
|
|
<td style="text-align: left">Arduino Uno R3 ATmega328PU</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">2</td>
|
|
<td style="text-align: left">Arduinno prototyping shield</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Arduino SPIO Extension Board with bus</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">~</td>
|
|
<td style="text-align: left">Pushbutton</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Arduino HW-130 motor control shield</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">2</td>
|
|
<td style="text-align: left">Ultrasonic sensor HC-SRO4</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">DC motor driver L298N</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">6x AA battery pack</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">9V battery pack</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Servo motor SG90</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">LCD display 1602A without pins</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">LCD display 1602A with pins</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Relay bank 8x SRD-12VDC-SL-C</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Relay bank 8x JQC-3FF-S-Z</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Relay SRD-05VDC-SL-C</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Relay HJR-3FF-S-Z</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">23</td>
|
|
<td style="text-align: left">Infrared sensor Flying-Fish</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">2</td>
|
|
<td style="text-align: left">Multimedia remote control</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Thumb joystick</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">PIR Motion detector XC4444</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">DC motor</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Stepper motor 28BYJ-48</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Remote 8-bit I/O expander for I2C bus PCF8574T</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Sound sensor</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">2</td>
|
|
<td style="text-align: left">Digital LED display sets</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Stepper motor 28BYJ-48</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">2</td>
|
|
<td style="text-align: left">Stepper motor controller X113647</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Servo motor SG90</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Potentiometer, small 10kΩ</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">2</td>
|
|
<td style="text-align: left">Potentiometer, 10kΩ</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Potentiometer, 5kΩ</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Potentiometer, 1kΩ</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Joystick</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Touchpad</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Water sensor</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Light sensor TEMT6000</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Triple axis compass</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Sound and buzzer module</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Real time clock w/o battery</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">RFID sensor RFID-RC522</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">RFID card</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">RFID fob</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">DC motor</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">1</td>
|
|
<td style="text-align: left">Servo motor, unmarked</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left">2</td>
|
|
<td style="text-align: left">Display driver MAX7219CNG</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<a href="/programming/embedded/inventory/" class="ba b--moon-gray bg-light-gray br2 color-inherit dib f7 hover-bg-moon-gray link mt2 ph2 pv1">read more</a>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="relative w-100 w-30-l mb4 bg-white">
|
|
<div class="relative w-100 mb4 bg-white nested-copy-line-height">
|
|
<div class="bg-white mb3 pa4 gray overflow-hidden">
|
|
<span class="f6 db">Programmings</span>
|
|
<h1 class="f3 near-black">
|
|
<a href="/programming/general/coding-for-humans/" class="link black dim">
|
|
|
|
</a>
|
|
</h1>
|
|
<div class="nested-links f5 lh-copy nested-copy-line-height">
|
|
<h1 id="coding-for-humans">Coding for humans</h1>
|
|
<ul>
|
|
<li>Code is instructions for machines.</li>
|
|
</ul>
|
|
<p>BUT</p>
|
|
<ul>
|
|
<li>Code is read by humans.</li>
|
|
<li>Humans need to be able to understand code easily.</li>
|
|
<li>Not all humans think about code the same way</li>
|
|
</ul>
|
|
<p>SO</p>
|
|
<ul>
|
|
<li>Write maintainable code
|
|
<ul>
|
|
<li>If design is about usability, coding is about maintainability</li>
|
|
</ul>
|
|
</li>
|
|
<li>Write boring code that’s easily modified and extended
|
|
<ul>
|
|
<li>Consistent patterns</li>
|
|
<li>Avoid obscure and fancy syntax</li>
|
|
<li>Aim for maximum readability</li>
|
|
</ul>
|
|
</li>
|
|
<li>Use dev tools to make the job easier and less error-prone
|
|
<ul>
|
|
<li>Syntax highlighting</li>
|
|
<li>Code completion</li>
|
|
<li>Linters and formatters</li>
|
|
<li>Static analysis</li>
|
|
<li>Statically typed languages or type hinting</li>
|
|
</ul>
|
|
</li>
|
|
<li>Write documentation to guide devs
|
|
<ul>
|
|
<li>Explain how programs work so devs don’t have to reverse-engineer your
|
|
team’s work.</li>
|
|
<li>Explain the reasoning behind obscure solutions.</li>
|
|
<li>Document pitfalls you’ve fallen into so other devs don’t do the same.</li>
|
|
</ul>
|
|
</li>
|
|
<li>Write code that accommodates different kinds of devs. Devs can be:
|
|
<ul>
|
|
<li>Inexperienced:</li>
|
|
<li>New to the codebase</li>
|
|
<li>Opinionated</li>
|
|
<li>Impatient</li>
|
|
<li>Bored</li>
|
|
<li>Tired</li>
|
|
<li>Pressured</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<a href="/programming/general/coding-for-humans/" class="ba b--moon-gray bg-light-gray br2 color-inherit dib f7 hover-bg-moon-gray link mt2 ph2 pv1">read more</a>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="relative w-100 w-30-l mb4 bg-white">
|
|
<div class="relative w-100 mb4 bg-white nested-copy-line-height">
|
|
<div class="bg-white mb3 pa4 gray overflow-hidden">
|
|
<span class="f6 db">Programmings</span>
|
|
<h1 class="f3 near-black">
|
|
<a href="/programming/general/pull-requests/" class="link black dim">
|
|
|
|
</a>
|
|
</h1>
|
|
<div class="nested-links f5 lh-copy nested-copy-line-height">
|
|
<h1 id="pull-request-practices">Pull request practices</h1>
|
|
<p>Practices to make code review smoother and more productive.</p>
|
|
<h2 id="submit-your-final-draft-not-your-first">Submit your final draft, not your first</h2>
|
|
<p>It may be tempting to get your work into code review as soon as possible, but if
|
|
you ask people to read your spaghetti code, then you’ll find that your PR will
|
|
take longer to review, plus reviewers will burn their time and energy asking
|
|
you to fix obvious mistakes instead of checking for more subtle problems.</p>
|
|
</div>
|
|
<a href="/programming/general/pull-requests/" class="ba b--moon-gray bg-light-gray br2 color-inherit dib f7 hover-bg-moon-gray link mt2 ph2 pv1">read more</a>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="relative w-100 w-30-l mb4 bg-white">
|
|
<div class="relative w-100 mb4 bg-white nested-copy-line-height">
|
|
<div class="bg-white mb3 pa4 gray overflow-hidden">
|
|
<span class="f6 db">Programmings</span>
|
|
<h1 class="f3 near-black">
|
|
<a href="/programming/general/working-on-a-team/" class="link black dim">
|
|
|
|
</a>
|
|
</h1>
|
|
<div class="nested-links f5 lh-copy nested-copy-line-height">
|
|
<h1 id="what-ive-learned-from-working-on-a-team">What I’ve learned from working on a team.</h1>
|
|
<p>A cordial working environment is more important than getting everything your
|
|
way, or optimal engineering practices. You have to pick your battles and focus
|
|
on fixing just the things that you can’t work with at all.</p>
|
|
<p>Some devs are mediocre programmers. Some devs are mediocre communicators. Some
|
|
are both.</p>
|
|
<p>Good documentation (comments, readmes, pull-requests) makes everyone’s job
|
|
easier.</p>
|
|
</div>
|
|
<a href="/programming/general/working-on-a-team/" class="ba b--moon-gray bg-light-gray br2 color-inherit dib f7 hover-bg-moon-gray link mt2 ph2 pv1">read more</a>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="relative w-100 w-30-l mb4 bg-white">
|
|
<div class="relative w-100 mb4 bg-white nested-copy-line-height">
|
|
<div class="bg-white mb3 pa4 gray overflow-hidden">
|
|
<span class="f6 db">Programmings</span>
|
|
<h1 class="f3 near-black">
|
|
<a href="/programming/general/writing-good-code/" class="link black dim">
|
|
|
|
</a>
|
|
</h1>
|
|
<div class="nested-links f5 lh-copy nested-copy-line-height">
|
|
<h1 id="writing-good-code">Writing good code</h1>
|
|
<p>Good is boring.</p>
|
|
<p>Good code can be understood by junior developers.</p>
|
|
<p>Great code can be understood by people who have just learned how to code.</p>
|
|
</div>
|
|
<a href="/programming/general/writing-good-code/" class="ba b--moon-gray bg-light-gray br2 color-inherit dib f7 hover-bg-moon-gray link mt2 ph2 pv1">read more</a>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="relative w-100 w-30-l mb4 bg-white">
|
|
<div class="relative w-100 mb4 bg-white nested-copy-line-height">
|
|
<div class="bg-white mb3 pa4 gray overflow-hidden">
|
|
<span class="f6 db">Programmings</span>
|
|
<h1 class="f3 near-black">
|
|
<a href="/programming/web/tech-stack/frontend/" class="link black dim">
|
|
|
|
</a>
|
|
</h1>
|
|
<div class="nested-links f5 lh-copy nested-copy-line-height">
|
|
|
|
</div>
|
|
<a href="/programming/web/tech-stack/frontend/" class="ba b--moon-gray bg-light-gray br2 color-inherit dib f7 hover-bg-moon-gray link mt2 ph2 pv1">read more</a>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="relative w-100 w-30-l mb4 bg-white">
|
|
<div class="relative w-100 mb4 bg-white nested-copy-line-height">
|
|
<div class="bg-white mb3 pa4 gray overflow-hidden">
|
|
<span class="f6 db">Programmings</span>
|
|
<h1 class="f3 near-black">
|
|
<a href="/programming/web/tech-stack/overview/" class="link black dim">
|
|
|
|
</a>
|
|
</h1>
|
|
<div class="nested-links f5 lh-copy nested-copy-line-height">
|
|
<h1 id="my-web-tech-stack">My web tech stack</h1>
|
|
<h2 id="frontend-client-side-in-the-browser">Frontend (client side, in the browser)</h2>
|
|
<h3 id="ui-development">UI development</h3>
|
|
<ul>
|
|
<li>Styling</li>
|
|
<li>Forms</li>
|
|
<li>Navigation</li>
|
|
<li>Multimedia</li>
|
|
<li>Debugging in Chrome DevTools</li>
|
|
</ul>
|
|
<h3 id="ui-design">UI design</h3>
|
|
<ul>
|
|
<li>Apply Human-Centred Design.</li>
|
|
<li>Create static mockups in Inkscape.</li>
|
|
</ul>
|
|
<h2 id="backend">Backend</h2>
|
|
<h3 id="databases">Databases</h3>
|
|
<ul>
|
|
<li>MySQL</li>
|
|
<li>SQLite</li>
|
|
</ul>
|
|
<h3 id="apis">APIs</h3>
|
|
<ul>
|
|
<li>REST</li>
|
|
<li>JSON:API</li>
|
|
<li>Laravel</li>
|
|
<li>Symfony</li>
|
|
<li>.NET Core</li>
|
|
</ul>
|
|
<h3 id="content-management-systems">Content management systems</h3>
|
|
<ul>
|
|
<li>Drupal</li>
|
|
<li>Wordpress</li>
|
|
</ul>
|
|
<h3 id="search">Search</h3>
|
|
<ul>
|
|
<li>Apache Solr</li>
|
|
</ul>
|
|
<h3 id="static-sites">Static sites</h3>
|
|
<ul>
|
|
<li>Gatsby</li>
|
|
<li>Hugo</li>
|
|
</ul>
|
|
<h3 id="design-patterns">Design patterns</h3>
|
|
<ul>
|
|
<li>MVC</li>
|
|
<li>Stack middleware</li>
|
|
<li>Dependency injection, service container</li>
|
|
<li>Pub-sub, events</li>
|
|
<li>Batch processing</li>
|
|
<li>Caching</li>
|
|
<li>Throttling, rate limiting</li>
|
|
</ul>
|
|
<h2 id="system-administration-maintaining-the-os-filesystem-services">System administration (maintaining the OS, filesystem, services)</h2>
|
|
<p>Bash scripting</p>
|
|
</div>
|
|
<a href="/programming/web/tech-stack/overview/" class="ba b--moon-gray bg-light-gray br2 color-inherit dib f7 hover-bg-moon-gray link mt2 ph2 pv1">read more</a>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</section></article>
|
|
|
|
</main>
|
|
<footer class="bg-black bottom-0 w-100 pa3" role="contentinfo">
|
|
<div class="flex justify-between">
|
|
<a class="f4 fw4 hover-white no-underline white-70 dn dib-ns pv2 ph3" href="http://localhost:1313/" >
|
|
© My New Hugo Site 2025
|
|
</a>
|
|
<div><div class="ananke-socials"></div>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
</body>
|
|
</html>
|