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

5/25/2025

Help organize multiple React projects within a single GitHub repository, ensuring each project has i

My Folder Structure Goal (Visual): React-Learning/ │ ├── Classroom-Project/...

Ana Paula

5/24/2025

Kevin’s Courses platform

Hi guys, i just landed here so apologies if this is the wrong channel. I’m currently enrolled on Kevin’s HTML & CSS for absolute beginners course. Since yesterday it seems that the platform is not working, given that I can’t access the lessons. It won’t go anywhere from the screenshot. Is anybody having the same issue or being aware of any reason why? Thanks!...

Antonio C.

5/24/2025

Issue with View Transition API

Good morning everyone. For a few days I have been trying, without success, to implement a page transition (different pages, MPA) using the view transition API, only with CSS. The idea is to animate a div in its scaleY property, changing from 0 to 1, when exiting the page and from 1 to 0 when entering the new page. This div, positioned absolutely, is placed on top of the content of the page, working as a sort of curtain. I studied the theory of API, asked various AIs, checked browser compatibility, etc. but nothing. It doesn't work. Can anyone help me? At the following link there is a simple live demo with the code I hypothesized....

Jan (sudoku.coach)

5/24/2025

flex behaving differently in Firefox / Chrome

Hi there! Firefox seems to be calculating the required horizontal space for elements inside a flex with flex-direction: column and flex-wrap: wrap wrong. The image is what I'm trying to do (and it works well in Chrome)....

JonathanH

5/23/2025

Grid or Flex when building Sponsor Page

I'm building a sponsor logo page for a website and I'm not sure if using grid or flex would be better? Part of me feels like grid would be more robust, but would be more work when additional sponsors are added - image is from last year's conference, so right now I only have half the sponsors due to being a few months out....

Lexi

5/23/2025

Usage of Headings

I've posted a couple times and got various feedback on projects, one of the things I always received feedback on is headings. Often times that I shouldn't use one. So for arguments sake here's a use case. Would someone please walk me through what parts are improper? ```// CTA Header <section> <h1>Example Header</h1>...

bfmv

5/23/2025

confused on, from where and how to learn.

so i have been getting alot of contrary suggestions on how to learn html,css, js (or any programming language), so i thought to make this post earlier, i would use youtube tutorials, w3 schools, or literally any website that appeared in my google search results and do alot of practice. but then i heard that those resources are unreliable and i should only learn from mdn, but i struggle alot with it, and now most of my time gets spent trying to understand what is meant in mdn rather than practicing....

Vlack⸮

5/23/2025

Loop my images

I want to loop my images infinitely but after they're done scrolling it just restarts it abruptly

DOCTYPE_html.txt

McMarty

5/22/2025

Accordion at top with content below

Can I have a mini-IA using an accordion menu at the top of a web page, but then have regualr content below it? So when the user expands an element in the accordion, the page content just shifts down slightly....

Faker

5/22/2025

What is the difference betwen .mjs vs .cjs vs .js (Are these used in JavaScript or in node?)

Hello, can someone explain what is the difference between the file extensions used in node/js, .mjs, .cjs and .js please. I always sticked to .js so is there any use case of the other file extensions? I know that .mjs stands for module javascript or something like that, so naming a file as .js means we don't necessarily need to modify our package.json to include type as module ? What about .cjs please, I just know it stands for common javascript. Do the import and export statement differs between these extensions?...

Karol

5/22/2025

Reasonably priced SMTP provider for hobby project?

Can anyone recommend some providers that you've checked personally? I want to use it only to send email confirmation, password reset etc....

vince

5/22/2025

Am I refactoring unnecessarily?

We have some base styles created by .js config files through Tailwind (media query values, colors, etc) and then compiled automatically into css variables. We have a .js file like this: ```js theme: {...

roycube.

5/22/2025

Complicated ? Grid question

hi guys i have a css expert question i have a use case of a grid that can have from 1 to 16 items. it should be reponsive bothe from a screen prespective and from an item prespcetive where items should be distrbuted evently ni the gris and the coloumns should be calculated base on grid items. for example 4 itesm 2 column 8 items 3 coulmns. also the grid should dbe repsonsive by screen size so if small screen grid is just 1fr. for example,. in addition the height width of each grid should mainata...

lanszelot

5/22/2025

HTML lot of youtube videos How to?

Hello, I would like to embed/create on my site a "youtube playlist" like on the image. If I embed the youtube playlist it shows only one video, and the three lines.....no, I do not like it. If I embed one by one the videos (iframe) the site slow down....no, not good If I create images, and onclick open a modal and play the video....yes, I like it....

MC23

5/22/2025

Problem with flex wrap

I'm having a flex container that wraps differently from what I expected. I'd like the single selects to go next to the dates, but since the first div with dates wraps itself, the selects go in a new row. ```html <div class="flex gap-10"> ...

GamersPlane

5/21/2025

Can't transition padding

The base problem I'm trying to solve is I have an element that I want to be able to click on, and then a second element appears to side down from behind, all simple divs with text inside each. Best I can tell, the best way to do this to make things a grid and transition on the grid-template-rows. That part of the transition worked fine, but because I was using a negative top value + a padding top of the same value, padding would just appear, then the height transition. So I tried to transition on padding-top as well, but it didn't work. I created a JSFiddle showing my code: https://jsfiddle.net/ftgu7zc1/1/ Any suggestions on how to fix this bliping? Should I be using something other than negative top/positive padding top to make it look like it's coming down from behind?...

bfmv

5/21/2025

trying to understand forms

trying to understand forms through mdn

HansM

5/21/2025

Switching from grid-auto-flow: column; to row in gridception?

How is it possible to kind of (or actually) do a responsive switch from grid-auto-flow: column behavior to row (with random widths) for all rows at once (if the maxcontent of all grids together doesn't fit in one line)? (1.1.1 cannot break to a new line alone, also 1.1 and 2.1 should break at the same time, either all intermediate containers stacked or none). I might want to "switch" the innermost grid from column to row, too, when it's really narrow (never in "column"-mode though), but that's not really important. Also, how do I create horizontal alignment between 1.1/1.2 and 2.1 in "row"-mode? Subgrid maybe? (I guess I could make this work eventually myself but I don't have an idea how to do a responsive "switch" between column and row mode, so I might as well mention this here)...

CDL

5/20/2025

Fetch API - Help a dumbass out.

I've stored it in a .env file called WEATHER_API_KEY in my App.vue I have 1 resource saying to save the API key to a variable called

 process.env.WEATHER_API_KEY

 process.env.WEATHER_API_KEY

and another saying

 import.meta.env.VITE_WEATHER_API_KEY

 import.meta.env.VITE_WEATHER_API_KEY

...

Ganesh

5/20/2025

Disable file parallelism for api-DB integration tests

I will be using vitest and supertest with express as my backend framwork to test my REST api. I have beforeEach blocks in my test files to wipe the db state and fill it with dummy data so each test has same DB state to work with. Vitest by default runs the tests in different files concurrently. The problem with this is that the different tests might conflict with each other as they might insert same data that invokes validation violation. I can disable file parallelism in vitest just for these database tests so that they are run one after another even if they are in different files....

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 🙂.