Search icon CANCEL
Subscription
0
Cart icon
Your Cart (0 item)
Close icon
You have no products in your basket yet
Save more on your purchases! discount-offer-chevron-icon
Savings automatically calculated. No voucher code required.
Arrow left icon
All Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Newsletter Hub
Free Learning
Arrow right icon
timer SALE ENDS IN
0 Days
:
00 Hours
:
00 Minutes
:
00 Seconds

WebDevPro #81: Web Storage and Cookies, Frontend Resources, Top React Frameworks, Continue And Persist, QwQ, The Intercept’s lawsuit against OpenAI.

Save for later
  • 10 min read
  • 10 Dec 2024

Web development blogs, tutorials and resources following

 

Advertise with Us|Sign Up to the Newsletter

@media only screen and (max-width: 100%;} #pad-desktop {display: none !important;} }

@media only screen and (max-width: 100%;} #pad-desktop {display: none !important;} }

webdevpro-81-web-storage-and-cookies-frontend-resources-top-react-frameworks-continue-and-persist-qwq-the-intercepts-lawsuit-against-openai-img-0

Software delivery to dedicated edge devices is one of the most complex challenges faced by IT professionals today. While edge deployments come with inherent complications, it’s possible to avoid the pitfalls. With this guide in hand, a little planning, and the right tools and strategies in place, you can be confident you’ll never push a faulty update at scale.

Read the Guide

WebDevPro #81: Web Storage and Cookies, Frontend Resources, Top React Frameworks, Continue And Persist, QwQ, The Intercept’s lawsuit against OpenAI.

 

Hi ,

Welcome to the web app development world with the 81st edition of _webdevpro! This will be the last issue of 2024 before the holidays. We will see you again next year - after much rest and rejuvenation!

In this edition we cover web development community discussions on:

Don't miss our repository of manually curated collection of Tailwind CSS resources for web developers.

In our relatively new section captures internet jibber-jabber about the mobile ecosystem:

Today's news covers Ruby on Rails and Svelte.

P.S.: If you have any suggestions or feedback, or would like us to feature your project on a particular subject, please write to us. Just respond to this email!

If you liked this installment, fill in our survey below and win a free Packt PDF.

Take the Survey Now!

Thanks,
Apurva Kadam
Editor-in-Chief, Packt

 

webdevpro-81-web-storage-and-cookies-frontend-resources-top-react-frameworks-continue-and-persist-qwq-the-intercepts-lawsuit-against-openai-img-1

 

Web Dev Community Speak

What are Web developers discussing? What are the latest tips and tricks? Shortcuts and experiments? Cool tutorials? Releases and updates? Find it all out here.

Understanding Web Storage: LocalStorage, SessionStorage, and Cookies - In modern web development, managing data on the client side has become an essential skill. Developers often rely on localStorage, sessionStorage, and cookies to store data in the user’s browser. While these three mechanisms serve similar purposes, they have distinct differences in terms of capacity, persistence, and use cases. In this blog, we'll explore these differences, with examples, to help you better understand when and how to use each one.

Frontend Resources V2 - This collection is packed with a wide range of tools that cover everything from building stunning user interfaces to fine-tuning performance and much more. These resources have been invaluable. Hoping they’ll be just as useful for you.

9 open-source gems to become the ultimate developer - For me, AI is everywhere.
But sometimes, it's hard to understand what a fun project is and what project you can use for your website. I have curated a list of 9 open-source repositories you can implement into your repository tomorrow!

Comparing The Top React Frameworks - When learning React, we all start with the CRA (create-react-app) library. It is a good place to begin the journey of React but using it for building a project today is not a good idea. There are many reasons to switch from traditional CRA to the modern framework of React, which can offer many more features. There are various alternatives based on your requirements such as SSR, performance, etc. In this blog, we are going to investigate some of the top alternatives that you can use instead of CRA.

Get Window Size in Pure CSS - We all know that CSS used to be the most challenging part of web development. However, it has become even harder nowadays. You wouldn't believe it, but now CSS can define properties, do the math, and even directly get the window size! This article will show you how to do it.

 

Web Dev Repos

Check this space for new repos, projects and tools each week! This week we bring you a collection of Tailwind CSS tools:

Tailwind Grid Generator- Drag and drop Tailwind CSS grid generator.

Tailwind Box Shadows Generator- Box Shadows generator.

Windframe- Tailwind CSS drag and drop builder to rapidly build and prototype websites.

Static Tailwind- The most used Tailwind classes, precompiled, with no build step.

Design GUI- AI-powered Chrome extension for managing colors in daisyUI and shadcn/ui.

webdevpro-81-web-storage-and-cookies-frontend-resources-top-react-frameworks-continue-and-persist-qwq-the-intercepts-lawsuit-against-openai-img-2

This is our final edition for 2024, but don’t worry—we’ll be back with more insights and updates in January 2025. In the meantime, we’ve got a little holiday treat for you!

Packt has some exciting offers lined up to help you boost your tech skills and get ready for an amazing new year! It’s the perfect opportunity to relax, learn something new, and stay ahead in your field. Keep an eye out for these special holiday deals!

From all of us at the Packt Newsletters team, we wish you a joyful holiday season and a fantastic start to 2025. See you next year! 🎄✨

 

Internet Jibber-Jabber

Random curious musings and interesting words about Mobile Dev on the Internet.

Continue And Persist - Send someone you appreciate an official ‘Continue and Persist’ Letter. Every day, thousands of Cease and Desist letters are issued, telling people to stop what they’re doing (Looking at you, David Chang). What a bummer! That’s why we created:TheContinue and Persist Letter. A official-lookinglegalletter that encourages and uplifts people, one that tells people to keep doing what they’re doing! Surprise someone you appreciate by sending them a Continue and Persist Letter.

Introducing some changes to our Web API - Web API endpoint integration. Effective today,newWeb API use cases will no longer be able to access or use the following endpoints and functionality in their third-party applications. Applications with existing extended mode Web API access that were relying on these endpoints remain unaffected by this change.

QwQ: Reflect Deeply on the Boundaries of the Unknown - What does it mean to think, to question, to understand? These are the deep waters that QwQ (Qwen with Questions) wades into. Like an eternal student of wisdom, it approaches every problem - be it mathematics, code, or knowledge of our world - with genuine wonder and doubt. QwQ embodies that ancient philosophical spirit: it knows that it knows nothing, and that’s precisely what drives its curiosity. Before settling on any answer, it turns inward, questioning its own assumptions, exploring different paths of thought, always seeking deeper truth. We invite you to explore alongside QwQ, embracing both its insights and its imperfections as part of the endless quest for understanding.

Core copyright violation claim moves ahead in The Intercept’s lawsuit against OpenAI - Last week, aNew York federal judge ruleda key copyright violation claim by The Intercept against OpenAI would move ahead in court. The ruling is the latest in a series of major legal decisions involving the AI developer this month, after OpenAI sought to dismiss lawsuits from several digital news publishers.

Steel - Steel.dev is an open-source browser API that makes it easy to build AI apps and agents that interact with the web. Instead of building automation infrastructure from scratch, you can focus on your AI application while Steel handles the complexity. This repo is the core building block behind Steel - a production-ready, containerized browser sandbox that you can deploy anywhere. It includes built-in stealth capabilities, text-to-markdown session management, UI to view/debug sessions, and full browser control through standard automation frameworks like Puppeteer, Playwright, and Selenium.

Unlock access to the largest independent learning library in Tech for FREE!
Get unlimited access to 7500+ expert-authored eBooks and video courses covering every tech area you can think of.
Renews at €14.99/month. Cancel anytime

webdevpro-81-web-storage-and-cookies-frontend-resources-top-react-frameworks-continue-and-persist-qwq-the-intercepts-lawsuit-against-openai-img-3 webdevpro-81-web-storage-and-cookies-frontend-resources-top-react-frameworks-continue-and-persist-qwq-the-intercepts-lawsuit-against-openai-img-4 

 

Web Development Tutorial

An excerpt from 'Django 5 by Example'By Antonio Melé

Using a class-based view to list posts

To understand how to write class-based views, we will create a new class-based view that is equivalent to thepost_listview. We will create a class that will inherit from the genericListViewview offered by Django.ListViewallows you to list any type of object.

Edit theviews.pyfile of theblogapplication and add the following code to it:

from django.views.generic import ListView class PostListView(ListView): """ Alternative post list view """ queryset = Post.published.all() context_object_name = 'posts' paginate_by = 3 template_name = 'blog/post/list.html'

ThePostListViewview is analogous to thepost_listview we built previously. We have implemented a class-based view that inherits from theListViewclass. We have defined a view with the following attributes:

We usequerysetto use a custom QuerySet instead of retrieving all objects. Instead of defining aquerysetattribute, we could have specifiedmodel = Postand Django would have built the genericPost.objects.all()QuerySet for us.

We use the context variablepostsfor the query results. The default variable isobject_listif you don’t specify anycontext_object_name.

We define the pagination of results withpaginate_by, returning three objects per page.

We use a custom template to render the page withtemplate_name. If you don’t set a default template,ListViewwill useblog/post_list.htmlby default.

Now, edit theurls.pyfile of theblogapplication, comment the precedingpost_listURL pattern, and add a new URL pattern using thePostListView class.

Read the 'Django 5 by Example' book now!

 

What's Happening in Web Development?

Your dose of the latest releases, news and happenings in the Web Development industry!

Ruby on Rails

Silence deprecate message during “app:update” command
When running theapp:updatecommand you previously may see warnings due to not adopting thenew_framework_defaults. This PR silences those messages to avoid confusion.

Reword error message for NoDatabaseError
This patch adds some suggestions on what to do when you run into this error.

Redesign ActionView::Template::Handlers::ERB.find_offset to handle edge cases
Some excellent work was put into improving the ERB template error highlighting in this PR, as well as fixing a bug withmultibyte character tokenization.

Make column_definitions queries retryable
Previously when an application wasn’t using a schema cache in production apingquery would be executed for each table when it was loaded the first time.

Make Action Dispatch Session#store method conform to Rack spec
TheRack specificationstates that a hash-like object stored in environment withrack.sessionkey must implementstore/2method with[]=semantics.

Preserve timezone and locale in ActiveJob exception handlers
This PR fixes a bug where the job locale and timezone were wrong inside therescue_fromblock.

 

SvelteKit, Svelte CLI and Language Tools 

adapter-autonow supports the Bun package manager (3.3.1,#12854)

TheSvelte CLInow supports a number of add-ons for new and existing projects. You can find the entire list of add ons inthe CLI Repositoryor by runningnpx sv createfrom your command line.

The Svelte extension now provides a Svelte 5 component migration command (extensions-109.1.0)

 

Trending Titles

webdevpro-81-web-storage-and-cookies-frontend-resources-top-react-frameworks-continue-and-persist-qwq-the-intercepts-lawsuit-against-openai-img-5

Building LLM Powered Applications

$39.99
$27.98

webdevpro-81-web-storage-and-cookies-frontend-resources-top-react-frameworks-continue-and-persist-qwq-the-intercepts-lawsuit-against-openai-img-6

CompTIA Security+ SY0-701 Certification Guide

Print $44.99

webdevpro-81-web-storage-and-cookies-frontend-resources-top-react-frameworks-continue-and-persist-qwq-the-intercepts-lawsuit-against-openai-img-7

Django 5 By Example

$39.99 
$27.98

 

And that’s a wrap.

P.S.: If you have any suggestions or feedback, or would like us to feature your project on a particular subject, please write to us. Just respond to this email!

webdevpro-81-web-storage-and-cookies-frontend-resources-top-react-frameworks-continue-and-persist-qwq-the-intercepts-lawsuit-against-openai-img-8 webdevpro-81-web-storage-and-cookies-frontend-resources-top-react-frameworks-continue-and-persist-qwq-the-intercepts-lawsuit-against-openai-img-9 

 

 

 

*{box-sizing:border-box}body{margin:0;padding:0}a[x-apple-data-detectors]{color:inherit!important;text-decoration:inherit!important}#MessageViewBody a{color:inherit;text-decoration:none}p{line-height:inherit}.desktop_hide,.desktop_hide table{mso-hide:all;display:none;max-height:0;overflow:hidden}.image_block img+div{display:none}sub,sup{font-size:75%;line-height:0}#converted-body .list_block ol,#converted-body .list_block ul,.body [class~=x_list_block] ol,.body [class~=x_list_block] ul,u+.body .list_block ol,u+.body .list_block ul{padding-left:20px} @media (max-width: 100%;display:block}.mobile_hide{min-height:0;max-height:0;max-width: 100%;overflow:hidden;font-size:0}.desktop_hide,.desktop_hide table{display:table!important;max-height:none!important}} @media only screen and (max-width: 100%;} #pad-desktop {display: none !important;} } @media only screen and (max-width: 100%;} #pad-desktop {display: none !important;} }