WebDevPro #8: 100+ unique CSS patterns, Top 10 ChatGPT Plugins You Can't Miss and 7 Useful Resources for Web Developers
Hi << Test First Name >>,
Welcome to the _webdevpro! In today's edition we cover web development community discussions on 100+ unique CSS patterns, Top 10 ChatGPT Plugins You Can't Miss and 7 Useful Resources for Web Developers. We bring you the latest in Web Dev, with releases from Laravel, Ruby on Rails and Spring to help you keep up to date!
Working on understanding state in React? Our React with TypeScript tutorial can help! Don't miss our repository of curated tools to help you boost your web development.
We have listened to the _webdevpro readership and we think this is something you have been searching for. If you liked this installment in our new series, fill in our survey below and win a free Packt credit. We're committed to bringing our readers exactly what they want, so help us make the right choices.
Take the Survey and Win a Free Packt Credit!
Thanks,
Apurva Kadam
Editor-in-Chief, Packt
Web Developer Community Insights
Write Better Code by Following these JavaScript Best Practices - Whether you're a seasoned developer looking for ways to refine your coding style or a beginner eager to grasp the essentials, this blog post is for you. In this comprehensive guide, you'll explore various best practices that can help you elevate your JavaScript skills to the next level. Read about JavaScript coding practices.
100+ unique CSS patterns – In this article, you will find numerous customer coded CSS patterns ready to use for your projects. Each CSS pattern is coded in a similar way – with one variable to control the size and each color is defined in the code. All you must do is one click to copy/paste the code and adjust a few variables. Grab a nice pattern and build your website. The collection will keep growing in the future so don't forget to bookmark the site.
Top 10 ChatGPT Plugins You Can't Miss – Is the end of Google and search is near? OpenAI just released ChatGPT Plugins to everyone. In this blogpost, you will find top 10 ChatGPT plugins to transform your productivity. Learn about the top 10 ChatGPT plugins here.
Building an intelligent CRM using ChatGPT, PostgreSQL, and ToolJet - In this tutorial, you'll learn how to build a CRM (Customer Relationship Management) application using ChatGPT, ToolJet, and PostgreSQL. The CRM application will allow you to add new users or customers to a PostgreSQL database, view their details on a dashboard, generate email templates using ChatGPT, and send them emails via Sendinblue. Read the tutorial here.
Building a bidding system with NextJS – NextJS introduced its new server actions components, and this blogpost tests them out to see what all the fuss is about. The tutorial shows how to build a simple app where you can register to the system, add a new product, and bid on it. Once the bid is in, it will notify the other bidders that they have been outbid. It will also inform the seller of a new bid in the system. Watch the full YouTube here.
7 Useful Resources for Web Developers - As developers, we always aim to work smarter, not harder. We want to be more efficient, simplify our processes, and deliver top-notch projects quickly. To achieve these goals, we need the right tools, resources, and techniques. In this article, we'll delve into 7 valuable resources that every web developer should be aware of. These resources have been carefully selected to help you maximize your efficiency, minimize repetitive tasks, and focus on what truly matters. Learn more.
Web Development Motivation
"Good web design is about the character of the content, not the character of the designer."
- Jeffrey Zeldman, Web Designer and Author
Food for Thought...
Jeffrey Zeldman reminds us that in web development, content is key. Good design should amplify the character and quality of the content, ensuring it takes center stage. By prioritizing content-driven design, we create meaningful and impactful web experiences that resonate with users. Let Zeldman's insight guide you in delivering valuable messages through your designs.
WebDev Resources
Web development tools are software applications or programs that help web developers in analyzing and tracking, performance optimizing and monitoring their web applications. These tools are designed to make the development process more efficient, effective, and less time-consuming. Here is a list of Web Dev tools to supercharge your development:
Text Compare / Difference Checker
https://www.diffchecker.com/
Domain Name Generator
https://www.panabee.com/
https://domainwheel.com/
https://www.namemesh.com/
https://namelix.com/
DNS Checker
https://dnschecker.org/
https://www.whatsmydns.net/
https://intodns.com/
https://dns-record-viewer.online-domain-tools.com/
Port Checker
React Web Development Tutorial
Understanding events
Browser events happen as the user interacts with DOM elements. For example, clicking a button raises a click event from that button.
Logic can be executed when an event is raised. For example, an alert can be closed when its close button is clicked. A function called an event handler (sometimes referred to as an event listener) can be registered for an element event that contains the logic to execute when that event happens.
Note
See the following link for more information on browser events:
https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Events.
Events in React events are very similar to browser native events. In fact, React events are a wrapper on top of the browser’s native events.
Event handlers in React are generally registered to an element in JSX using an attribute. The following code snippet registers a click event handler called handleClick on a button element:
<button onClick={handleClick}>...</button>Next, we will return to our alert component and implement a click handler on the close button that closes the alert....read more.
What's Happening in Web Dev?
Lavarel
Laravel Octane Adds Support for Roadrunner v3 - The Laravel team relased Laravel Octane V2, with support for Roadrunner V3. The pull request brings Octane up to date with Release v2023.1.0 and beyond (also known as V3), so check out the "2023" releases to see what's new with Roadrunner.
Laravel Precognition Updates are Here - Laravel Precognition was overhauled and ships with a fresh perspective on predicting the outcome of a future HTTP request. The Laravel team has taken the original version and polished it to streamline front-end and server-side validation with popular front-end tools.
Ruby on Rails
Rails 7.0.5 has been released - To view the changes for each gem, please read the changelogs on GitHub: Action Cable CHANGELOG, Action Mailbox CHANGELOG, Action Mailer CHANGELOG, Action Pack CHANGELOG and more! To see a summary of changes, please read the release on GitHub: 7.0.5 CHANGELOG
Spring
Spring Authorization Server is on Spring Initializr! - Spring announced that you have a new superpower: creating applications with Spring Authorization Server on Spring Initializr! That's right, it's time to begin your OAuth2 journey and become the hero you always knew you could be!
See you next week!