Dec. 4, 2021, 2:42 p.m.

Building a simple Calendly clone with Phoenix LiveView + NextAuth.js v4 & Floating UI πŸ—“οΈ

Fullstack Digest


Releases


pg_graphql: A GraphQL extension for PostgreSQL

Releases PostgreSQL

GraphQL support is in development for PostgreSQL + Supabase.


Sandpack| Component toolkit for creating live-running code editing experiences

Releases

Sandpack is a component toolkit for creating live-running code editing experiences powered by CodeSandbox.


Remix v1

Releases React.js

We're so excited to announce the official release of Remix v1 πŸŽ‰

It's time to build better websites.https://t.co/ujxcEirFXAhttps://t.co/KVkKYqk3Am

β€” Remix πŸ’Ώ (@remix_run) November 22, 2021


GitHub - GitHub actions/runner v2.285.0

Releases

Release v2.285.0 Β· actions/runner Β· GitHub

Features Print source of secret in runs (Actions/Dependabot/None) #1411 Support node.js 16 and bump node.js 12 version #1439 Bugs Fix a bug where local node action would crash in post-steps #148...

Including Node 16 support.


NextAuth.js v4 is out! πŸš€πŸ“¦

Releases Next.js

v4 is out! πŸš€πŸ“¦οΈ

πŸ”’οΈ Improved Providers (better OAuth, OIDC support)
πŸ”’οΈ Improved Adapters
πŸ”’οΈ More secure/consistent by default
πŸ”’οΈ Middleware Support
πŸ”’οΈ Fully rewritten in TypeScript
πŸ”’οΈ Decoupled core from API Routes
πŸ”’οΈ ... and more!

`npm i next-auth@latest`

β€” Auth.js (@authjs) December 1, 2021


Backend


Building a simple Calendly clone with Phoenix LiveView (pt. 1) | bigardone.dev

Backend Elixir

...When Phoenix v1.6 and LiveView v0.17 came out, my feelings about LiveView changed utterly, and I couldn't resist making something more extensive to test out all its new features, making me finally understand all of its power.


Frontend


Floating UI

Frontend

Floating UI is a low-level library for positioning "floating" elements like tooltips, popovers, dropdowns, menus and more. Since these types of elements float on top of the UI without disrupting the flow of content, challenges arise when positioning them.


Making Accessibility More Accessible

Frontend

Get more team members involved with accessibility by sharing tools they'll actually use. A11y tools for design, development, QA, and CI/CD.


The Power of Vue 3 Function Refs - Part 1

Frontend Vue.js

Function refsβ€”a specific kind of template refβ€”have quickly become my favorite Vue 3 feature. They unlock clean, powerful composition function patterns, with great DX for both the function authors and function consumers.


The Vite Ecosystem

Frontend

An exploration of the projects, teams and individuals collaborating to push Vite and the DX of our frontend tooling forward.


GitHub - uilibrary/AatroX-vue

Frontend Vue.js CSS

GitHub - uilibrary/AatroX-vue: πŸ’š A Free Vuejs 3 Minimal Admin Dashboard Develop with Vuejs 3, Vite, and TailwindCss. It's Free and Open Source πŸ’₯

πŸ’š A Free Vuejs 3 Minimal Admin Dashboard Develop with Vuejs 3, Vite, and TailwindCss. It's Free and Open Source πŸ’₯ - uilibrary/AatroX-vue

A Minimal Admin Dashboard Develop with Vuejs 3, Vite, and TailwindCss. It's Free and Open Source.


Why IndexedDB is slow and what to use instead

Frontend

So you have a JavaScript web application that needs to store data at the client side, either to make it offline useable, just for caching purposes or for other reasons...


Penpot | Design Freedom for Teams

Frontend

The open-source solution for design and prototyping.


Tooling


GitHub - trailofbits/pip-audit

Tooling Python

GitHub - pypa/pip-audit: Audits Python environments, requirements files and dependency trees for known security vulnerabilities, and can automatically fix them

Audits Python environments, requirements files and dependency trees for known security vulnerabilities, and can automatically fix them - pypa/pip-audit

Audits Python environments and dependency trees for known vulnerabilities


JetBrains Fleet: The Next-Generation IDE

Tooling

Built from scratch, based on 20 years of experience developing IDEs. Fleet uses the IntelliJ code-processing engine, with a distributed IDE architecture and a reimagined UI.


In other news

Computer Networking Basics Every Developer Should Know

In other news

What is a LAN? What is a network segment? Ethernet collision domains vs broadcast domains. How network switches work? How to send IP packets? VLAN vs VXLAN.


Electron Fiddle | Electron

In other news Node.js JavaScript

The easiest way to get started with Electron. Electron Fiddle lets you create and play with small Electron experiments


You just read issue #13 of Fullstack Digest. You can also browse the full archives of this newsletter.

Powered by Buttondown, the easiest way to start and grow your newsletter.