-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy path2021-06-13-tipsrundan-37.html
More file actions
103 lines (101 loc) · 14.9 KB
/
Copy path2021-06-13-tipsrundan-37.html
File metadata and controls
103 lines (101 loc) · 14.9 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
---
layout: splash
title: "Tipsrundan 37"
excerpt: "Today we're **stacked** with content 🎉 So let's get this party started! 🥳 "
---
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body style="background: #fff;color: #000;font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;line-height: 150%;margin: 0 auto;overflow-x: hidden;padding: 0.5rem 0.25rem;max-width: 800px;">
<table border="0" cellspacing="0" width="100%">
<tr>
<td></td>
<td width="800">
<div class="section" style="width: 100%;justify-content: center;">
<div class="header" style="margin: 0 auto;max-width: 800px;padding: 0.5rem 0.25rem;width: 100%;text-align: center;color: #edf2f4;background-color: #2b2d42;padding-top: 0;">
<p style="margin: 0.75rem 0;padding: 0;color: #8d99ae;">2021-06-15 - Issue #37 - <a href="https://afry-south.github.io/" style="color: #920de9;font-weight: bold;text-decoration: none;">Blog ✍️</a></p>
<h1 style="margin: 0;text-align: center;line-height: 150%;"><a href="https://afry-south.github.io/" target="blank" style="color: #920de9;font-weight: bold;text-decoration: none;"><img src="https://raw.githubusercontent.com/afry-south/afry-south.github.io/master/afry.png"></a> Tipsrundan</h1>
<p style="margin: 0.75rem 0;padding: 0;color: #8d99ae;">Your biweekly newsletter of 'Tips' from <b>IT South@AFRY</b> with ❤️ <br><small style="color: #999;">(🗳️ Tipsboxen (<a href="mailto:it.south.competence@afconsult.com?subject=Tipsbox&body=Title%0D%0ASummary%0D%0ALink" style="color: #920de9;font-weight: bold;text-decoration: none;">Email</a>, <a href="https://github.com/afry-south/afry-south.github.io/issues/1" target="_blank" style="color: #920de9;font-weight: bold;text-decoration: none;">GitHub</a> & <a href="https://buitsouth.slack.com/archives/CPK80KX0W" target="_blank" style="color: #920de9;font-weight: bold;text-decoration: none;">Slack</a>) - All tips are appreciated! 🙏)</small></p>
</div>
</div>
<div class="section" style="width: 100%;justify-content: center;">
<div class="aside" style="justify-content: center;text-align: start;padding: 0.5rem;">
<p style="text-align: center;width: 75%;margin: 0.75rem auto;padding: 0;">👋<i> Welcome to Tipsrundan! <br>Today we're **stacked** with content 🎉 So let's get this party started! 🥳 </i></p>
<a href="https://afry-south.github.io/tipsrundan/2021-06-15-tipsrundan-37" style="margin: 0.5rem auto;color: #920de9;font-weight: bold;text-decoration: none;"><button style="border-radius: 5px;font-size: medium;display: block;font-weight: bold;margin: 0.5rem auto;padding: 1rem 2rem;background-color: #2b2d42;border: 2px solid #d99ae;color: #fff;">Take me to pretty version!</button></a></div>
</div>
<hr style="background-color: #e9e9e9;border: none;height: 1.5px;width: 50%;margin: 0.5rem auto;">
<h1 style="margin: 0;text-align: center;line-height: 150%;">Supertipset 💡</h1>
<div class="section" style="width: 100%;justify-content: center;">
<div class="aside" style="justify-content: center;text-align: start;padding: 0.5rem;">
<h3 style="margin: 0;text-align: center;line-height: 150%;">Temporary Notepad in the Web Browser</h3>
<p style="margin: 0.75rem 0;padding: 0;">Oscar Carlsson has a great little 'hack' that will have your friends turn their head.<br>
Start of by having a Web Browser, then open a new tab and paste the following</p><p style="margin: 0.75rem 0;padding: 0;"><code style="background-color: #118bee0b;border-radius: 5px;color: #000;display: inline-block;margin: 0 0.1rem;padding: 0rem 0.5rem;text-align: left;">data:text/html, <html contenteditable></code></p><p style="margin: 0.75rem 0;padding: 0;">Then open the page. This will <strong>give you a editable blank area</strong>. 🎉 And you'll certainly feel a bit like a hacker 👨💻.</p><p style="margin: 0.75rem 0;padding: 0;">On a more serious note this is seriously a <em>really</em> good way to have a notepad ready to quickly alter text before moving it somewhere else.<br>
Oscar suggests that you add this as a bookmark to simplify the usage!</p> </div>
</div>
<main style="margin: 0 auto;max-width: 800px;padding: 0.5rem 0.25rem;">
<hr style="background-color: #e9e9e9;border: none;height: 1.5px;width: 50%;margin: 0.5rem auto;">
<h1 style="margin: 0;text-align: center;line-height: 150%;">Godisboxen 🍭</h1>
<div class="section" style="width: 100%;justify-content: center;">
<div class="aside" style="justify-content: center;text-align: start;padding: 0.5rem;">
<h3 style="margin: 0;text-align: center;line-height: 150%;">🎒 Hosting SQLite databases on GitHub Pages or any static file host</h3>
<p style="margin: 0.75rem 0;padding: 0;">This is really mind-bending. I love it.<br>
It takes a lot of "thinking outside of the box", a pinch of genius and work to have made this and the blog.</p><p style="margin: 0.75rem 0;padding: 0;">If you're interested in understanding how a static file hoster (like GitHub Pages) can be used in conjunction with a DB <strong>without a backend</strong> then make sure to check this out.</p><p style="margin: 0.75rem 0;padding: 0;">It really is a treat and left me amazed!</p><a href="https://phiresky.github.io/blog/2021/hosting-sqlite-databases-on-github-pages/" target="blank" style="width: 100%;color: #920de9;font-weight: bold;text-decoration: none;"><small style="color: #999;">phiresky.github.io↗</small></a>
<hr style="width: 10%;background-color: #e9e9e9;border: none;height: 1.5px;margin: 0.5rem auto;">
</div>
<div class="aside" style="justify-content: center;text-align: start;padding: 0.5rem;">
<h3 style="margin: 0;text-align: center;line-height: 150%;">🔀 Radio Garden – Explore live radio by rotating the globe</h3>
<p style="margin: 0.75rem 0;padding: 0;">Internet Radio has become a standard which every channel now supports. This has brought some awesome integrations with apps and everything, but one thing that is really cool is <em>radio.garden</em> which allows you to listen to any channel available on the earth 🌍!</p><p style="margin: 0.75rem 0;padding: 0;">Scroll around the earth and listen to some cool languages & their music.</p><a href="https://radio.garden/" target="blank" style="width: 100%;color: #920de9;font-weight: bold;text-decoration: none;"><small style="color: #999;">radio.garden↗</small></a>
<hr style="width: 10%;background-color: #e9e9e9;border: none;height: 1.5px;margin: 0.5rem auto;">
</div>
<div class="aside" style="justify-content: center;text-align: start;padding: 0.5rem;">
<h3 style="margin: 0;text-align: center;line-height: 150%;">🔀 Project Starline: Feel like you're there, together </h3>
<p style="margin: 0.75rem 0;padding: 0;">A new cool project from Google where Spatial Audio and a large screen is supposed to make virtual communication much closer to real-life experience.</p><blockquote style="display: block;font-style: italic;line-height: 150%;max-width: 460px;text-align: center;"><p style="margin: 0.75rem 0;padding: 0;">.. Project Starline — a technology project that combines advances in hardware and software to enable friends, families and coworkers to feel together, even when they're cities (or countries) apart.</p></blockquote><p style="margin: 0.75rem 0;padding: 0;">Who knows, it might end up in the famous [killedbygoogle.com](<a href="https://killedbygoogle.com/)-graveyard" style="color: #920de9;font-weight: bold;text-decoration: none;">https://killedbygoogle.com/)-graveyard</a> but it's pretty cool and I love the progress made on communication tech!</p><a href="https://blog.google/technology/research/project-starline/" target="blank" style="width: 100%;color: #920de9;font-weight: bold;text-decoration: none;"><small style="color: #999;">blog.google↗</small></a>
<hr style="width: 10%;background-color: #e9e9e9;border: none;height: 1.5px;margin: 0.5rem auto;">
</div>
<div class="aside" style="justify-content: center;text-align: start;padding: 0.5rem;">
<h3 style="margin: 0;text-align: center;line-height: 150%;">📱 Real World: CSS vs CSS-in-JS</h3>
<p style="margin: 0.75rem 0;padding: 0;">A lot of modern front-ender now supply JS inside the JS code through different tools like <code style="background-color: #118bee0b;border-radius: 5px;color: #000;display: inline-block;margin: 0 0.1rem;padding: 0rem 0.5rem;text-align: left;">styled-components</code> which is pretty awesome because it makes the CSS much simpler to reason and understand.</p><p style="margin: 0.75rem 0;padding: 0;">But is there <em>any drawbacks?</em> What about size? What about load times?<br>
In this blog you'll learn all about the different approaches performance characteristics. <strong>What do you prefer?</strong></p><a href="https://pustelto.com/blog/css-vs-css-in-js-perf/" target="blank" style="width: 100%;color: #920de9;font-weight: bold;text-decoration: none;"><small style="color: #999;">pustelto.com↗</small></a>
<hr style="width: 10%;background-color: #e9e9e9;border: none;height: 1.5px;margin: 0.5rem auto;">
</div>
<div class="aside" style="justify-content: center;text-align: start;padding: 0.5rem;">
<h3 style="margin: 0;text-align: center;line-height: 150%;">📱 You Might Not Need jQuery</h3>
<p style="margin: 0.75rem 0;padding: 0;">Sometimes things happen in parallel, or you're using a tool because it has always existed. The browser itself has evolved a lot and so has the built-in methods & CSS. A lot of things previously done programatically, often through jQuery, is now possible with simple tools.</p><p style="margin: 0.75rem 0;padding: 0;">Make sure to check out this page before you start implementing something complex!</p><a href="http://youmightnotneedjquery.com/" target="blank" style="width: 100%;color: #920de9;font-weight: bold;text-decoration: none;"><small style="color: #999;">youmightnotneedjquery.com↗</small></a>
<hr style="width: 10%;background-color: #e9e9e9;border: none;height: 1.5px;margin: 0.5rem auto;">
</div>
<div class="aside" style="justify-content: center;text-align: start;padding: 0.5rem;">
<h3 style="margin: 0;text-align: center;line-height: 150%;">🎒 The Twelve-Factor App: A methodology for building Software-as-a-Service (SaaS)</h3>
<p style="margin: 0.75rem 0;padding: 0;">A new cool project from Google where Spatial Audio and a large screen is supposed to make virtual communication much closer to real-life experience.</p><blockquote style="display: block;font-style: italic;line-height: 150%;max-width: 460px;text-align: center;"><p style="margin: 0.75rem 0;padding: 0;">.. Project Starline — a technology project that combines advances in hardware and software to enable friends, families and coworkers to feel together, even when they're cities (or countries) apart.</p></blockquote><p style="margin: 0.75rem 0;padding: 0;">Who knows, it might end up in the famous [killedbygoogle.com](<a href="https://killedbygoogle.com/)-graveyard" style="color: #920de9;font-weight: bold;text-decoration: none;">https://killedbygoogle.com/)-graveyard</a> but it's pretty cool and I love the progress made on communication tech!</p><a href="https://12factor.net/" target="blank" style="width: 100%;color: #920de9;font-weight: bold;text-decoration: none;"><small style="color: #999;">12factor.net↗</small></a>
<hr style="width: 10%;background-color: #e9e9e9;border: none;height: 1.5px;margin: 0.5rem auto;">
</div>
<div class="aside" style="justify-content: center;text-align: start;padding: 0.5rem;">
<h3 style="margin: 0;text-align: center;line-height: 150%;">🎒 Adding git repositories as a dependency using PURE gradle</h3>
<p style="margin: 0.75rem 0;padding: 0;">The twelve-factor app is a methodology for building software-as-a-service apps that:</p><pre style="white-space: normal;"><code style="background-color: #118bee0b;border-radius: 5px;color: #000;display: block;margin: 1rem 0;padding: 1rem;text-align: left;max-width: 800px;">Use declarative formats for setup automation, to minimize time and cost for new developers joining the project;
Have a clean contract with the underlying operating system, offering maximum portability between execution environments;
Are suitable for deployment on modern cloud platforms, obviating the need for servers and systems administration;
Minimize divergence between development and production, enabling continuous deployment for maximum agility;
And can scale up without significant changes to tooling, architecture, or development practices.
</code></pre><p style="margin: 0.75rem 0;padding: 0;">The twelve-factor methodology can be applied to apps written in any programming language, and which use any combination of backing services (database, queue, memory cache, etc).</p><p style="margin: 0.75rem 0;padding: 0;">Even if you don't end up reading this it's certainly a good thing to bookmark!</p><a href="https://schlaubi.medium.com/did-you-know-you-can-add-git-repositories-as-gradle-dependencies-8bc414cb18b4" target="blank" style="width: 100%;color: #920de9;font-weight: bold;text-decoration: none;"><small style="color: #999;">schlaubi.medium.com↗</small></a>
<hr style="width: 10%;background-color: #e9e9e9;border: none;height: 1.5px;margin: 0.5rem auto;">
</div>
<div class="aside" style="justify-content: center;text-align: start;padding: 0.5rem;">
<h3 style="margin: 0;text-align: center;line-height: 150%;">🎒 Kotlin/Native Memory Management Update</h3>
<p style="margin: 0.75rem 0;padding: 0;">Native? Memory? Good writing?<br>
✅ ✅ ✅</p><p style="margin: 0.75rem 0;padding: 0;">For those that don't really know how memory/GC:s work I think this is a good introduction on some implementations and I'd be happy to find someone to discuss / work more in this field with!</p><a href="https://blog.jetbrains.com/kotlin/2021/05/kotlin-native-memory-management-update/" target="blank" style="width: 100%;color: #920de9;font-weight: bold;text-decoration: none;"><small style="color: #999;">blog.jetbrains.com↗</small></a>
<hr style="width: 10%;background-color: #e9e9e9;border: none;height: 1.5px;margin: 0.5rem auto;">
</div>
</div>
</main>
<div class="footer" style="margin: 0 auto;max-width: 800px;padding: 0.5rem 0.25rem;width: 100%;text-align: center;color: #edf2f4;background-color: #2b2d42;">
<div class="section" style="width: 100%;justify-content: center;">
<p style="margin: 0.75rem 0;padding: 0;color: #8d99ae;"><b style="color: #8d99ae;">Thank you for this time see you in two weeks</b><br>- Hampus Londögård @ IT South</p>
</div>
</div>
</td>
<td></td>
</tr>
</table>
</body>
</html>