WebDevPro #45: 30 JS Tricks, Async vs Defer, Styling Checkboxes, CSS for printing to paper, Rust for Embedded Systems, Claude 3 Model Family.
Test URL Advertise with Us | Sign Up to the Newsletter
Hello!
Thanks for being a valued member of the Packt Publishing family! Since you've used our products, we figured that you'd benefit from our free Web development newsletter to keep you up to date on market trends and advancements. Check out the latest _webdevpro issue below to learn more about what it has to offer. I hope you'll find it useful!
Our goal is to keep you informed through bite-sized actionable content in Web development in the form of practical articles & tutorials, illustrations, tools, and useful resources with every weekly issue. No jibber-jabber, no boring content.
Please feel free to reply to me in case of any queries. To help you understand what the _webdevpro has to offer, scroll below to read the latest issue. I hope you enjoy it.
Thanks,
Apurva Kadam
Editor-in-Chief, Packt
WebDevPro #45: 30 JS Tricks, Async vs Defer, Styling Checkboxes, CSS for printing to paper, Rust for Embedded Systems, Claude 3 Model Family.
March 12, 2024
Hi <<First Name>>,
Welcome to the _webdevpro! Your one stop for all things Web Dev!
We start today’s issue with community discussions on:
Don't miss our repository of manually curated collection of ChatGPT resources for web developers. Wanting to learn about Ruby? Our tutorial covers File Manipulation from the book ‘From PHP to Ruby’.
Our relatively new section captures internet jibber-jabber about topics in the web ecosystem:
Today's news covers Django, Laravel, Ruby on Rails, Spring 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.
Thanks,
Apurva Kadam
Editor-in-Chief, Packt
WebDev Community Speak
What is the WebDev industry talking about? Latest Developments? Cool tricks? Tutorials? Cheatsheets? How are Web Developers upskilling? Read about it all here.
30 JavaScript Tricky Hacks - Welcome to our curated collection of JavaScript tricks, which will help you optimize your code, make it more readable, and save you time. Let’s dive into the depths of JavaScript functionalities and hacks that go beyond the conventional and discover the full potential of this powerful programming language.
Async vs Defer in JavaScript: Which is Better? - This article explores an interesting Javascript topic. async and defer are attributes used when including external JavaScript files in HTML documents. They affect how the browser loads and executes the script. Let's learn about them in detail.
Tools that Make Me Productive as a Software Engineer - As a developer, prioritizing your tools is essential because they are pivotal in achieving your goals. In this article, I'll share the tools I use daily to boost my productivity. These tools assist me in various tasks, including documentation, wireframing, development, testing, debugging, and research. I've organized the tools into three categories: task management, development, and documentation. Let's dive into these tools without further ado.
Styling Checkboxes and Switches - I'm probably not the only developer who's frustrated about the browser's default <input type="checkbox">. First: it's not scalable. In this example, the font-size has been scaled up to 200%, but the checkbox remains at it's root size, which is 13.333333px. In this tutorial, we'll be dissecting the browser's default checkbox, and see, if we can do it better.
Learning Rust: Grasping the concepts - We're delving into Common Programming Concepts. As a web developer, I'm interested to see how Rust's stricter typing compares to the flexibility of JavaScript. This lesson covers fundamental Rust concepts like variables, basic types, functions, comments and control flow. At the end of the lesson we're encouraged to tackle a few coding challenges.
On a scale of 1-10, how would you rate the relevance and usefulness of the community discussions in today’s issue?
lowest 1 2 3 4 5 6 7 8 9 10 highest
Sorry, voting is closed.
WebDev Repos
We at WebDevPro highlight Web resources in a week-on-week series. This week we bring you manually curated collection of ChatGPT bot resources for web developers:
CodeReview Bot - GitHub Actions bot.
openai-pr-reviewer - GitHub Actions bot.
chatgpt-create-unit-tests - GitHub Actions bot that analyses a pull request and adds unit tests if necessary.
gpt4-pdf-chatbot-langchain - Chatbot for large PDF files.
wechat-chatgpt - Wechat bot.
Chat Bling - WhatsApp bot.
chatgpt-telegram-bot - Telegram bot that supports voice messages.
DuckDuckGPT - DuckDuckGo bot.
BraveGPT - Brave Search bot.
On a scale of 1-10, how would you rate the relevance and usefulness of the repositories in today’s issue?
lowest 1 2 3 4 5 6 7 8 9 10 highest
Sorry, voting is closed.
Have a GitHub project you want to show off? Write to us and we will feature it!
Internet Web Dev Jibber-Jabber
Random curious musings and interesting words about Web Dev on the Internet.
CSS for printing to paper - At work, one of the things I do often is write print generators in HTML to recreate and replace forms that the company has traditionally done handwritten on paper or in Excel. This allows the company to move into new web-based tools where the form is auto-filled by URL parameters from our database, while getting the same physical output everyone's familiar with. This article explains some of the CSS basics that control how your webpages look when printed, and a couple of tips and tricks I've learned that might help you out.
Improving Network Performance with Linux Flowtables - When we introduced flowtables into our stack, it reduced network latencies by 7.5%, and all it took was a7-line change. We thought that was remarkable and worth sharing! So in this post, we describe how we use Netfilter and flowtables for packet processing, and include a simple benchmark that shows flowtables’ benefits.
Rust for Embedded Systems - Embedded software is used in safety-critical systems such as medical devices and autonomous vehicles, where software defects, including security vulnerabilities, have severe consequences. Most embedded codebases are developed in unsafe languages, specifically C/C++, and are riddled with memory safety vulnerabilities. To prevent such vulnerabilities, RUST, a performant memory-safe systems language, provides an optimal choice for developing embedded software. This paper performs the first systematic study to holistically understand the current state and challenges of using RUST for embedded systems.
The Claude 3 Model Family: Opus, Sonnet, Haiku - We introduce Claude 3, a new family of large multimodal models – Claude 3 Opus, our most capable offering, Claude 3 Sonnet, which provides a combination of skills and speed, and Claude 3Haiku, our fastest and least expensive model. All new models have vision capabilities that enable them to process and analyze image data. The Claude 3 family demonstrates strong performance across benchmark evaluations and sets anew standard on measures of reasoning, math, and coding.
Git Worktrees and GitButler - The "worktree" tool in Git helps you work on multiple branches at the same time. Since GitButler solves the same basic problem, I'll take a minute to explain what git worktree does for those who haven't heard of it, and then also to compare it to how GitButler solves the same core issue.
Why Does 'is-number' Package Have 59M Weekly Downloads? - Why does this simple one-line package have so many downloads? Is the JS community filled with folks who can’t do this simple task without relying on a library? Are they rightfully the butt of all jokes? Have they learned nothing from the left-pad fiasco that broke the internet? The answer is more nuanced than that. ‘npm’ methodology of counting downloads is admittedly naive.
Gartner Predicts Search Engine Volume Will Drop 25% by 2026 - By 2026, traditional search engine volume will drop 25%, with search marketing losing market share to AI chatbots and other virtual agents, according to Gartner, Inc.
On a scale of 1-10, how would you rate the relevance and usefulness of the Internet Jibber-Jabber section in today’s issue?
lowest 1 2 3 4 5 6 7 8 9 10 highest
Sorry, voting is closed.
Web Dev Tutorial
File Manipulation
Some decades ago, one of the few options (if not the only option) for saving information was storing it in files. All sort of data was stored in these files: passwords, user data, config data, and more. Saving information in plain text files was, at the time, the most feasible option to save information. It all came to an end with the advent of databases (DBs) and DB usage. DBs became a more feasible and popular option, and they now came in different flavors. While this is still true today, using a DB comes with a quite expensive cost. I’m not only talking about a monetary cost – I’m talking about it in terms of memory, disk, and processing time. So, in certain use cases, it’s still a much better option to use plain text files to store information. To that purpose, most programming languages, including Ruby and PHP, make this task straightforward. Let’s take a look at how we can take advantage of the file manipulation tooling that comes with Ruby.
Let’s suppose we wanted to grab a user’s first name from a file. For this, we must create a file. The file will be called name.txt. We could name it without the file extension (.txt) and it would have no impact on the functionality of our script, but it’s always a good practice to give hints to our fellow developers as to the intent of our script. It’s pretty easy to assume that a file named name.txt will most probably contain text, and that text will be a name. So, let’s create the text file and add some text to it:
mary
Now, let’s focus on opening this file. There are different modes when opening files in Ruby, but for now, we will focus on reading data from the file. Let’s create a file called reading_file.rb and add the following code to it:
# reading_file.rb
File.open("name.txt")
First, we have to get Ruby to open the file so that it can handle and manipulate it. The File.open() method does exactly that. But now, we need to fetch the file’s contents to be able to use it in our script. First, we will assign the File.open() result to a variable. Our code will look like this:
# reading_file.rb
file_instance = File.open("name.txt")
With that, we saved the result of the File.open() method to the file_instance variable, which, in turn, now lets us have access to the file’s contents. Ruby has a very intuitive method for grabbing a file’s contents: the read() method. The read() method grabs a file’s contents and casts it into a string. So, let’s grab that string and output it to make sure our script is working. Now, our script looks like this:
# reading_file.rb
file_instance = File.open("name.txt")
user_name = file_instance.read
puts "The user's name is #{user_name}"
If we were to run our script on the shell with ruby reading_file.rb, the output would be as follows:
The user's name is mary
And voilà – we have successfully read a value from a text file. In the code, we got Ruby to open the name.txt file. Then, from the instance we got as a result, we obtained the original file’s contents as a string. Lastly, we used the value in a string to output something useful to the user. We can get fancy and capitalize the username with our already acquainted capitalize() method. We can also test that our script is reading from the name.txt file. Let’s open the name.txt file and change the name contained in the file to something else:
nancy
Now, let’s run our script in the shell again with ruby reading_file.rb. The output should be as follows:
The user's name is nancy
Regarding reading a file’s contents, this is as easy as it gets. The code, while not as intuitive as other examples we’ve written, is still simple and readable. Now, let’s write another example in which we could include the user’s last name. We could simply add the last name to the text file, and it would be a valid solution, but let’s look at that solution and a couple of variations. So, let’s add a new text file called full_name.txt with the following content:
paul smith
We’re going to manipulate this file with another Ruby script called full_name.rb. Initially, the script is going …read more.
Read the “From PHP to Ruby Basics” book now!
On a scale of 1-10, how would you rate the relevance and usefulness of the tutorial section in today’s issue?
lowest 1 2 3 4 5 6 7 8 9 10 highest
Sorry, voting is closed.
What's Happening in Web Dev?
Your dose of the latest releases, news and happenings in the Web Development industry!
Django
Django security releases issued: 5.0.3, 4.2.11, and 3.2.25 - The Django team is issuing Django5.0.3, Django4.2.11, and Django 3.2.25.These releases addresses the security issue detailed below. We encourage all users of Django to upgrade as soon as possible.
Laravel
Phone Number Formatting, Validation, and Model Casts in Laravel - The Laravel-Phone package makes working with phone numbers in PHP and Laravel a breeze, offering validation rules, attribute casting, utility helpers, and more.
Increment a Rate Limiter by a Custom Amount in Laravel 10.46 - The Laravel team released v10.46 this week with new Enum validation methods, incrementing a rate limiter by a custom amount, Conditionable Enum validation rules, and more.
Ruby on Rails
Rails security update releases - Rails Versions 6.1.7.7, 7.0.8.1, and 7.1.3.2 have been released last week which contain fixes for security issues.
Introduce assert_initializer - Compliments the existing initializer generator action.
Set default_url_options values in development/test environments - Prior to this commit, new Rails applications would raise ActionView::Template::Error ifa mailer included a url built with a *_path helper.
Fix error message for not derived foreign key in Active Record - Using query_constraints method with a single non-primary-key column used to raise as expected, but with an incorrect error message. This has been fixed to raise with a more appropriate error message.
Spring
The State of Spring Survey Is Back! - The State of Spring survey is back! Last time we learned that 90% of respondents were looking forward to virtual threads through Project Loom. We learned that building APIs was still the main use case for Spring applications, with plain JSON over HTTP as the number one type of API. We also learned that native compilation with GraalVM was beginning to cool off a bit from its high point in popularity. What will we learn this year?
Svelte
What's new in Svelte - As you may already have heard, Svelte 5 is in preview. In the meantime, Svelte 4 (@latest) has had one bugfix. The Svelte 5 changelog has quite a few updates, though:
breaking: $derived.call is now $derived.by (5.0.0-next.54, Docs, #10445)
Destructuring derived object properties will now keep fine-grain reactivity (5.0.0-next.55, Docs, #10488)
The new hydrate method makes hydration-related code tree shakeable (5.0.0-next.56, Docs, #10497)
Nested CSS is now supported, along with better support for :is(...) and :where(...) (5.0.0-next.57, #10490)
breaking: The client-side API has been simplified by removing createRoot, adjusting the mount/hydrate APIs and introducing unmount (5.0.0-next.58, Issue#9827, #10516)
For all the bug fixes, chores and underlying work required to getSvelte 5 to release-ready, check out the CHANGELOG on main.
On a scale of 1-10, how would you rate today’s issue of WebDevPro in terms of being informative, engaging, and useful?
lowest 1 2 3 4 5 6 7 8 9 10 highest
Sorry, voting is closed.
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!
Someone forwarded this email? Sign Up here!
Not for you? Unsubscribe here.
Copyright (C) 2024 Packt Publishing. All rights reserved.
As a GDPR-compliant company, we want you to know why you’re getting this email. The _webdevpro team, as a part of Packt Publishing, believes that you have a legitimate interest in our newsletter and the products associated with it. Our research shows that you, <<Email Address>> , opted-in for communication with Packt Publishing in the past and we think that your previous interest warrants our appropriate communication. If you do not feel that you should have received this or are no longer interested in _webdevpro, you can opt out of our emails by unsubscribing here.
Our mailing address is:
Want to change how you receive these emails?
You can update your preferences or unsubscribe