Posts tagged: dev

Alternatives to Using Pure Black (#000000) for Text and Backgrounds In order to achieve maximum contrast in design, interface designers often use a combination of pure black and white colors, which helps… Medium · uxplanet.org [1] A nice set of blacks to use in web design. Subtle variants off of black or white like this can really make your design look nice and modern. Note This post is a thought [2]. It’s a short note that I make about someone else’s content online #thoughts References: [1]: https://uxplanet.org/alternatives-to-using-pure-black-000000-for-text-and-backgrounds-54ef0e733cdb [2]: /thoughts/

External Link X (formerly Twitter) · x.com [1] This is a pretty incredible use of css grid to overlay items overtop of each other without needing to resort to position: absolute and the side effects that it brings. .wrap { display: grid; & > * { grid-row: 1; grid-column: 1; } } Note This post is a thought [2]. It’s a short note that I make about someone else’s content online #thoughts References: [1]: https://x.com/wesbos/status/1834242925401694490 [2]: /thoughts/

A slug is the part of the url that comes after the domain. Commonly matches the file name of a markdown file many blogging systems. These are typically human readable, unique identifiers for pages within the site.

Wikilinks are a core concept within obsidian to link to documents by Slug [1] wrapped in double square brackets. These are commonly used within wiki site generators. [[slug]] Obsidian gives you a keybinding alt+enter to go to that file, but if it does not exist it will create the file for you in the root of the project. It’s a nice way to quickly make new documents. References: [1]: /slug/

Hotkey to open link under at the text cursor position while typing in edit mode I find myself not wanting to leave the keyboard for navigation and think a keyboard-only shortcut that could open a link at the text cursor position is at would be really handy for this case. Obsidian Forum · forum.obsidian.md [1] Obsidian has a go to definition like feature, the keybind is alt+enter, I would have never guessed this one. Note This post is a thought [2]. It’s a short note that I make about someone else’s content online #thoughts References: [1]: https://forum.obsidian.md/t/hotkey-to-open-link-under-at-the-text-cursor-position-while-typing-in-edit-mode/8144 [2]: /thoughts/

It was not obvious to me, but if you have a wikilink such as Trying Obsidian [1], you can jump to the file in obsidian, just like you can with lsp go to definition, the keybinding is alt + enter. References: [1]: /trying-obsidian/

I’ve long used copier to create all of my posts for my blog, and it works really well for my workflow. I think of a title, call a template, and give it a title. out of the box obsidian did not seem to work this way. It seems like it wants me to right click a file tree and make a new file using the tree, this is not my jam. Here is what I came up with to replace my til template. --- date: <% tp.file.creation_date() %> templateKey: til title: <%* const originalFileName = await tp.system.prompt("Enter file name"); const toTitleCase = str => str.replace( /\w\S*/g, txt => txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase() ); const title = toTitleCase(originalFileName); tR += title + '\n'; // Add the title to the template result -%> published: true tags: - --- <%* const fileName = originalFileName.toLowerCase().replace(/\s+/g, '-'); const newFilePath = `pages/til/${fileName}`; await tp.file.move(newFilePath); -%> <% tp.file.cursor() %> - tR is a return value, and it gets placed directly into the place it is in the file - to.file.cursor() creates a tab-index point so I can tab into the content

I’m giving obsidian a go as an editor for my blog and one of the main things I want to fix in my workflow is the ability to quickly drop in images. on first look through the community plugins I found Image Converter. I set it up to convert to webp and drop them in a git [1] submodule. I may make it something other than a git repo in the future, but I’ve learned that adding images to my blog repo quickly makes it heavy and hard to clone on other machines. [2] Once the images are there they are pushed and deployed as their own site to cloudflare pages. I made a quick edit to my sick wikilink hover [3] plugin for my blog. if it sees a wikilink ending in webp, convert the domain over to obsidian-assets.waylonwalker.com, and clean up the remaining "! " that the python md-it library leaves behind. Note after first try I needed to increase the width from 600 to 1400, the image in this post was unreadable. This is part of me getting set up and Trying Obsidian [4] References: [1]: /glossary/git/ [2]: https://dropper.waylonwalker.com/api/file/626d85b1-5588-45c4-a4f4-c372dc7c8ff3.webp [3]: /sick-wikilink-hover/ [4]: /trying-obsidian/

External Link stackoverflow.com [1] today I learned that there is an accessibility feature in chrome that allows you to place a text cursor anywhere on the page. I had accidentally done this and it drove me mad that it was there. Note This post is a thought [2]. It’s a short note that I make about someone else’s content online #thoughts References: [1]: https://stackoverflow.com/questions/75886276/text-cursor-bug-in-my-chrome-browser-that-causes-the-blinking-cursor-to-appear-e [2]: /thoughts/

Command Line Interface Guidelines An open-source guide to help you write better command-line programs, taking traditional UNIX principles and updating them for the modern day. clig.dev [1] This is a pretty sick set of guidelines to help you write better cli programs, I’m definitely coming back to reading this one more in depth later. Note This post is a thought [2]. It’s a short note that I make about someone else’s content online #thoughts References: [1]: https://clig.dev/ [2]: /thoughts/

External Link fullystacked.net [1] You can explicitly make a script render blocking, nothing will be rendered until this js is ready. <script blocking="render" src="important.js" defer></script> Note This post is a thought [2]. It’s a short note that I make about someone else’s content online #thoughts References: [1]: https://fullystacked.net/render-blocking-on-purpose/ [2]: /thoughts/

FastHX - FastHX volfpeter.github.io [1] Very interesting approach to htmx [2] and fast api. It uses separate decorators for returning template partials and json that can be stacked to include both options on a single route. The templates are explicitly set in the decorator. Separate decorators are used for full page and partial pages. I don’t see an example of full and partial pages being combined. I think the demo app must be behaving in a spa like fashion where it does not get all of the data when it calls index and index will ask for user-list. Definitely going to keep my eye on this project and ponder on it. from fastapi import FastAPI from fastapi.templating import Jinja2Templates from fasthx import Jinja from pydantic import BaseModel # Pydantic model of the data the example API is using. class User(BaseModel): first_name: str last_name: str # Create the app. app = FastAPI() # Create a FastAPI Jinja2Templates instance and use it to create a # FastHX Jinja instance that will serve as your decorator. jinja = Jinja(Jinja2Templates("templates")) @app.get("/") @jinja.page("index.html") def index() -> None: ... @app.get("/user-list") @jinja.hx("user-list.html") async...

FastHX - FastHX volfpeter.github.io [1] Very interesting approach to htmx [2] and fast api. It uses separate decorators for returning template partials and json that can be stacked to include both options on a single route. The templates are explicitly set in the decorator. Separate decorators are used for full page and partial pages. I don’t see an example of full and partial pages being combined. I think the demo app must be behaving in a spa like fashion where it does not get all of the data when it calls index and index will ask for user-list. Definitely going to keep my eye on this project and ponder on it. from fastapi import FastAPI from fastapi.templating import Jinja2Templates from fasthx import Jinja from pydantic import BaseModel # Pydantic model of the data the example API is using. class User(BaseModel): first_name: str last_name: str # Create the app. app = FastAPI() # Create a FastAPI Jinja2Templates instance and use it to create a # FastHX Jinja instance that will serve as your decorator. jinja = Jinja(Jinja2Templates("templates")) @app.get("/") @jinja.page("index.html") def index() -> None: ... @app.get("/user-list") @jinja.hx("user-list.html") async...

Background Tasks - FastAPI FastAPI framework, high performance, easy to learn, fast to code, ready for production fastapi.tiangolo.com [1] fastapi [2] comes with a concept of background tasks which are functions that can be ran in the background after a function has been ran. This is handy for longer running functions that may take some time and you want to have fast response times. Here is an example from the docs from fastapi import BackgroundTasks, FastAPI app = FastAPI() def write_notification(email: str, message=""): with open("log.txt", mode="w") as email_file: content = f"notification for {email}: {message}" email_file.write(content) @app.post("/send-notification/{email}") async def send_notification(email: str, background_tasks: BackgroundTasks): background_tasks.add_task(write_notification, email, message="some notification") return {"message": "Notification sent in the background"} Note This post is a thought [3]. It’s a short note that I make about someone else’s content online #thoughts References: [1]: https://fastapi.tiangolo.com/tutorial/background-tasks/ [2]: /fastapi/ [3]: /thoughts/

[1] Damn, supply chain vector attacks are wild. Random guy in Primes stream was getting $40k offers to buy their open source project while in university and they have never made anything from it. What a social engineering attack this is. It would be so easy to make it look like a good deal and that the package was going to a good new owner who has real resources to maintain it. Note This post is a thought [2]. It’s a short note that I make about someone else’s content online #thoughts References: [1]: /static/https://www.youtube.com/watch?si=6NK4iCu1b1rCDo7a&amp;t=555&amp;v=mmlHQyMOK7Y&amp;feature=youtu.be [2]: /thoughts/

- Supply chain attacks are so big these days engineers definitely need to take these into consideration. It’s wild that such a simple attack vector hit some really big applications. This particular vector is so easy to avoid. You are already hosting web content, just curl the file and self host [1] the script, then you own it. That eliminates this attack vector all together, but doesn’t completely remove supply chain attacks, the js file can still hit external apis internally. What I see has happened in this case is that the owner of the domain polyfill.io changed. so anyone who directly linked to them got a malware injected script used. I can only imagine the number of applicatons that are not even being maintained anymore getting hit by this. TLDR, if you are taking something to production, where you are goind to deploy it and let it run, host the js yourself. these cdns are great for prototyping, but tread with caution. Note This post is a thought [2]. It’s a short note that I make about someone else’s content online #thoughts References: [1]: /self-host/ [2]: /thoughts/

- Two inspirational people in one podcast, its cool to see how adam thinks about code, css, webdev, and building businesses. Note This post is a thought [1]. It’s a short note that I make about someone else’s content online #thoughts References: [1]: /thoughts/