KPC

Kevin Powell - Community

A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.

Join

KPC

Kevin Powell - Community

A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.

Join

front-end

resources

back-end

ui-ux

os-and-tools

help

Myra

8/7/2025

Where to validate Mongoose Schema - Frontend or Backend?

I'm building a simple app with a login form and currently working on the backend. While creating the Mongoose schema to store user data, should I add validations like required, minLength, lowercase, match (for regex), etc., directly in the schema? Also, should I add similar validations in the frontend form as well — or is backend validation enough? Just want to understand what’s the best practice here: frontend, backend, or both?...

ᴋʙ

8/7/2025

Grid auto-fill or auto-fit min and max-width?

Using grid-template-columns repeat(auto-fill, minmax(300px, 1fr)) gets me 75% of the way there But this still allows for the cards to grow too much, if i instead use a single value like grid-template-columns repeat(auto-fill, 300px) it is also almost what i want but now the columns will stay the same size without any shrinking/growth, using grid-template-columns repeat(auto-fill, minmax(300px, 1fr)) ...

ZNP

8/6/2025

Navbar Help- How can I move it to have a central and right position

As you can see here the nav bar is central, with the icons on the right

Faker

8/6/2025

Why do we have so many free hosting websites

Hello, there are many free hosting websites, like vercel, github pages etc. Why there are so many hosting websites? How are each one different from each other?...

AFastCuber

8/6/2025

Make button width be determined by text after text wraps

My button looks great until the screen width gets too small and then the button text starts wrapping. That’s fine but the problem is that the width of the button stays the same and so it looks like there is a ton of padding even though there is not and the element overflows because of that. A width of fit content works until that text wraps. How do I make fit content work even after the text wraps?

Faker

8/6/2025

Progressive web app and technologies needed to build one

Hello, can someone elaborate on what a progressive web app is please. From my understanding it's just a responsive web app that works both on pcs and mobile. Are there any recommended technologies that we can use to build one?...

ᴋʙ

8/5/2025

Emulating a range slider

I am creating a highly customizable range slider with possibility multiple of multiple "thumbs" What i am trying to understand how to make it as accessable as possible. I am guessing that the input type range is as accessable as it can get, so how cam i emulate that....

ZNP

8/5/2025

What Methodology of CSS does Kev follow?

Kevin uses a mix of CUBE CSS and BEM, what exactly does he do? are there any specific guidelines he's said or you guys have noticed? I remember there was a video of him breifly explaining it, i've got his gold course, but i don't know which video he says it in...

Faker

8/5/2025

Difference between width set to 100% vs 100vw vs auto

Hello, can someone explain what is the difference to width property in css when we use 100%, 100vw and auto as values? 100vw is always relative to viewport width? 100% is always relative to parent container? ...

Faker

8/5/2025

What is Redux and why is it important in JS?

Hello, I often see people use the term "Redux" often in JS, can someone explain what it is and why is it important please.

Faker

8/5/2025

How does "dynamic" searching work?

Hello, consider a social media platform where we have a search bar. Normally, let say we are looking for a person John Doe. When we first type John, without even having to press enter, there are a list of suggestions that appear. I was wondering how does that work? I might have some ideas: The ineffective one:...

Ray

8/5/2025

Having some trouble designing a form generator.

I'm probably using the wrong words to describe things and I'm sorry for that; I'm self-taught and haven't been doing this for very long. This is a vanilla PHP question; I'm not using a framework or any libraries. So to start, what I have works fine. If I feed my FormPresets class a list of functions to do, it gives me the corresponding preset form fields paired with the appropriate labels, menus, headings, and section information that I expect for the context....

Stjerneman

8/4/2025

How to Keep Subgrid Row Sizes When Gap Differs from Parent?

I'm experimenting with CSS subgrid and ran into a problem with mismatched gap values. Kevin has this wonderful video on subgrid (https://www.youtube.com/watch?v=Zddz_R1RnfM&t=832s&ab_channel=KevinPowell), where he shows product cards using grid-template-rows: subgrid. In his demo, the gap on the subgrid matches the gap of the parent grid, and everything lines up nicely. But when I change the subgrid's gap, or the parent gap, the row sizing no longer behaves as expected....

davidhurwich

8/4/2025

<picture> / srcset

Hi, just interested for those who take care of responsiveness as part of your workflow if your team uses <picture> or srcset for image distribution between devices. I've noticed that most websites these days are 50/50 on whether these use <picture>. If your team does do you handle it, or does your CMS handle it?...

Pete (he/him)

8/4/2025

Difference between `:open` and `[open]`

I've just realized that :open is not supported on Safari. From what I can tell the [open] attribute selector should be a drop-in replacement (at least for my use case, styling a <dialog>). Can't find anything backing that up aside from Google's AI summary when I search for it. Does that seem right?

soma-foreever

8/4/2025

transform: translate vs translate, what's the difference?

It's not very clear from the docs how they're actually different. They both tend to do the same thing afterall. In the following example, the output will be same. ```css .container{ translate: -50px; /* transform: translate(-50px) */...

OverThinker

8/4/2025

Understanding Grid system

Code Pen: https://codepen.io/mab141211/pen/NPGjqbv I want to use the 0fr to 1fr grid logic in order to make this side bar work in two ways one normally when it will always be displaying and the other when it will be displayed only on hover and the body should be touching the ```html <div class="aside"></div>...

Collins

8/3/2025

challenge 02 conquering-responsive- layout Error

please, can someone proofread this code and check if this is also a responsive way of writing CSS and possibly provide a solution. i feel like I may have done something quite different from the norm. The code is below: https://codepen.io/Collins-Cypher/pen/jEbBRpB...

StainingLamb272

8/3/2025

Kevin's code not working on my PC

Hi, I've exported the files from codepen (https://codepen.io/kevinpowell/pen/xbGeNQy/ef22ccea0c2d257ae1a748f5fd4646da?editors=0010) and extracted the zip on my computer. The problem is the theme won't change. The page displays with the 'light' style from CSS (my system is dark) but nothing happens when I change from the dropdown....

thethingisback

8/3/2025

Dynamic (useRef extracted) styles not ready (assigned to useState var) in time for element mount

GH: https://github.com/nndesigns/old_cars_ltd.git Vercel: https://old-cars-ltd-4p2r-git-main-nick-nalls-projects.vercel.app/ File: vehiclePage.js (/frontend/src/pages/vehiclePage.js) ...

Previous Next

Gaming

Programming

Kevin Powell - Community

A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.

Kevin Powell - Community

A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.