14,488 questions
-3
votes
0
answers
23
views
Why is my web display not full when I add aos js? (bootstrap5) [closed]
I'm a junior web developer and I want to create a portfolio website using Bootstrap 5. When it's finalized, I want to add animations using AOS JS. However, when I add these, the website doesn't ...
0
votes
0
answers
26
views
How can I create an in-curved notch/cutout in a div border where another div overlaps it? [closed]
I'm trying to recreate an overlapping box layout where one box appears to "intrude" into another box's border with a smooth, curved notch effect (not just a straight cutout).
Here is the ...
Advice
0
votes
1
replies
67
views
Most Underrated Frontend Best Practice for Performance?
In modern front-end development, there are many techniques to improve performance like lazy loading, code splitting, and memoization.
In your experience, which underrated best practice has made the ...
Tooling
0
votes
1
replies
50
views
Azure App Service: Extracting a 60MB node_modules ZIP takes longer than running npm install — how to speed this up?
I have an automated deployment tool that generates a React or Angular project, uploads it to Azure App Service, and then restores node_modules to reduce build time.
To avoid running npm install on ...
Best practices
0
votes
3
replies
39
views
Nuxt.js pre-render data in the server for the seo purpose
We have a nuxt.js project which is an ecommerce site. We load the products page with first 100 products as SSR. after that we load other products as we needed from the client side using an API call. ...
Best practices
0
votes
0
replies
35
views
Next.js ESLint presets not compatible with ESLint 9 + Nx 22 flat-config — what is the correct way to support Next.js linting?
Recently we upgraded to Nx 22 and ESLint 9, which broke a lot of linting across the repo because the old .eslintrc-style configs and Next.js presets aren’t compatible with flat-config.
I spent quite a ...
Best practices
0
votes
0
replies
23
views
Repository pattern + useAsyncData + Pinia store, hydration + caching problems?
We follow this article to write all our API calls https://medium.com/@luizzappa/nuxt-3-repository-pattern-organising-and-managing-your-calls-to-apis-with-typescript-acd563a4e046 so we can fetch a ...
Advice
2
votes
0
replies
46
views
3 years as a frontend dev but feel under-skilled — how do I restart learning and regain confidence?
I’ve been working as a frontend developer for around 3 years, but honestly, I feel stuck.
My current company doesn’t really follow standard software engineering practices, and the work has become ...
Best practices
1
vote
1
replies
35
views
How to enable cross-feature communication in Nuxt without breaking DDD boundaries
I'm building a Nuxt 3 application using a feature-based architecture inspired by Domain-Driven Design.
Each feature is meant to be fully isolated, with its own components, state, API layer, and ...
Advice
0
votes
0
replies
52
views
How does a front-end dev think about different users' devices/settings without being overwhelmed?
My professional experience in tech has mostly been on the back-end, but I've been trying to learn more about front-end technologies like React so that I have more tools at my disposal. Broadly ...
-1
votes
0
answers
40
views
Using css mixin as a dynamic class name with the BEM (Block Element Modifier)
I am trying create a dynamic classes using BEM along with the css mixins.
.card--sty-1{
&__circle{}
&__link{};
}
.card--sty-2{
&__circle{}
&__link{};
}
...for --sty-[n ...
Advice
0
votes
4
replies
85
views
Conceptual question about Client Server systems
My colleague and I are having a discussion about some client server system we are building. After eliminating the particular details it comes down to a very basic conceptual question.
A backend is of ...
-2
votes
0
answers
41
views
React Flow + Dagre layout issue when node content size varies
import dagre from 'dagre';
import { Node, Edge, Position } from 'reactflow';
export default function layoutDAG(
nodes: Node[],
edges: Edge[],
dagType: 'T' | 'I' | 'D'
): { nodes: Node[]; edges: ...
Tooling
0
votes
1
replies
56
views
How can I automatically compress images during React build without breaking the asset paths?
I’m working on a React project using Vite as the build tool.
I’d like to automatically compress PNG and JPEG images when building for production, without changing the image import paths (so that ...
0
votes
1
answer
105
views
CSS opacity transition not working with iOS
I built a sort of timeline with a grid design and horizontal scrolling.
Dates are in the center row, while a picture is in 1st and some legend in 3rd.
The aim is to display pictures and legends only ...
0
votes
0
answers
123
views
How to see a Winforms custom control in Visual Studio designer?
I am following this tutorial to create a custom control that inherits from one different than UserControl.
When opening the designer view of this control, instead of seeing a render of the control, I ...
1
vote
1
answer
343
views
How do I use the built-in MCP server in Next.js 16 and configure next-devtools-mcp? [closed]
I'm exploring the new MCP (Model Context Protocol) server introduced in Next.js 16, and I’d like to understand how to properly enable and use it in a development environment.
What I’ve done so far:
...
1
vote
1
answer
92
views
Credit Card flip animation is glitching
https://kraker52.github.io/Flipping-Card/
Here is the link to the mini project I made (I don't think it would even be considered mini to you guys). The problem is when you try to hover on it from ...
0
votes
1
answer
123
views
How can I import an external javascript library (from a CDN) for a website and still have types in my editor?
I'm working in astro which uses vite as its bundler, don't know if that helps.
So basically I have p5.js as a dependency for a sketch I demonstrate on my portfolio site, using the library from npm, ...
1
vote
0
answers
61
views
Is there a way to remove the space underneath the baseline using CSS, other than line-height? [duplicate]
Before this gets flagged this as a duplicate of Remove space below the text baseline with CSS, the solution outlined there (adjusting line-height) has not solved my issue.
Here is a minimal ...
0
votes
1
answer
65
views
How to show Laravel session flash messages in Vue component using Inertia?
I’m using Inertia.js with Vue 3, and I want to show a success message when a form is submitted successfully.
In my controller I have:
public function store(Request $request)
{
$validated = $...
0
votes
0
answers
69
views
Why are my Laravel Inertia props not rendering in Vue component?
I’m using Laravel 10 with Inertia.js and Vue 3.
In my controller, I return a page like this:
use Inertia\Inertia;
use App\Models\User;
public function dashboard() {
$users = User::all();
...
2
votes
1
answer
81
views
Start a Tauri app which calls C function using sudo without password
I have made a Tauri app. This app uses C in the backend. The C file contains multiple functions. Some functions use the sudo command to get data. I have started this C file in the Tauri app by writing ...
-1
votes
2
answers
85
views
How to enforce identical keys across multiple i18n JSON translation files in TypeScript?
I’m working on a multilingual application with the following structure:
messages/
├── en.d.json.ts // baseline type definition
├── en.json
├── ja.json
├── zh-CN.json
└── zh-TW.json
Each file has ...
2
votes
1
answer
116
views
Text alignment shifts upward when using Arabic font (Tajawal) with Tailwind CSS and Next.js RTL
I’m working on a project using Next.js + next-intl + Tailwind CSS.
For English I’m using the Poppins font, and for Arabic I’m using Tajawal.
The problem is that when switching to Arabic (RTL), the ...
0
votes
0
answers
57
views
Quasar <q-select multiple> Chips Overflow and Auto-Grow Height Issue
I am using Quasar Framework and have a component with multiple and use-chips enabled.
The problem I am facing:
By default, the multi-select has 40px height.
I want to reduce the default height to ...
4
votes
1
answer
108
views
How to prevent text selection from being cleared when clicking a button on iPad Safari?
I'm developing a web application with a text-to-speech feature. Users can select text on the page and then click a "Play text to speech" button to have it read aloud. This works perfectly on ...
-1
votes
2
answers
118
views
React + Capacitor Android app cannot reach local Node backend over HTTP, but browser can
I have a React web app wrapped with Capacitor and running on Android. My backend is a Node.js server running on my local machine with IP 10.0.0.193:3000.
When I open the backend in my phone’s browser,...
0
votes
1
answer
108
views
<dialog> with position: fixed causes parent scrollbars on mobile — how to fix?
I'm trying to use a element that stays fixed on the screen, so I’ve applied:
dialog {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
margin: 0;
overflow: auto;
}
On ...
0
votes
2
answers
47
views
`core-js` with `@babel/preset-env` adds unnecessary polyfills and bloats bundle
I’m working on a web project built from an enterprise scaffold using webpack v5 and Babel. The target environment is Chrome ≥ 138 only.
However, I’ve noticed that the build includes unnecessary ...
0
votes
0
answers
120
views
Mercado Pago Payment Brick: missing_payment_information error when only accepting credit/debit cards
I'm integrating the Mercado Pago Payment Brick in my Vue 3 / TypeScript project, and I'm facing an issue: whenever I try to submit the payment, the Brick returns the error missing_payment_information ...
1
vote
2
answers
153
views
Can I remove the big box behind a chat input at the bottom of a Streamlit website?
I'm currently building a website that involves a chatbot, and in the chat message input, there's a black box behind it that is covering part of my background image. Is there a way to remove it? I ...
0
votes
0
answers
57
views
What is the best way to be handling onmounted calls while making sure the global state management array does not make the form dirty
This is my onMounted call and the loadTripAdvanceDetail function here is responsible for populating the form for edit operations however it makes my form dirty and gives me the unsaved changes dialog ...
1
vote
1
answer
84
views
Correct semantic markup for a quote's author: <cite> vs. <span> [closed]
Based on the HTML examples provided, is it considered better practice to mark up an author's name with the cite tag or a span tag? I've read that the cite tag is intended for referencing a work (like ...
-1
votes
2
answers
122
views
React hook form + react query. Sync defaultValues on refetch without clobbering dirty fields, and hard-reset after submit [closed]
Context
I’m using React Hook Form together with React Query. The parent component fetches data with a query, derives defaultValues, and passes them into the form.
Parent component:
export const ...
0
votes
1
answer
95
views
How to get contentWindow of iframe without mounting to DOM
I’m working on a React app where I need to manage multiple iframes dynamically. Each iframe is created only once and stored in a cache (Map/Ref) for reuse. At any given time, only the selected iframe ...
2
votes
0
answers
84
views
Can't execute API while using interceptors
I'm learning about DI-based interceptors in Angular 20. When I ran my Angular app, the home page (that contains API to get products) was loading for a long time and I received no response on the ...
0
votes
0
answers
65
views
CSS angle cut outline button [duplicate]
I need to build this special shaped button.
So initially the outline will be white and background will be transparent when I hover over it both the border and transparent background should become ...
1
vote
2
answers
270
views
How to make CSS infinite logo slider animation smooth without jumping?
I am creating a horizontal logo slider with multiple tracks.My goal is:
Even-numbered tracks should animate logos to the right.
Odd-numbered tracks should animate logos to the left.
Whenever I add new ...
2
votes
0
answers
52
views
DuckDB bundle issue on my Parcel application
I'm working on a Parcel frontend project using DuckDB, and it runs well in the Production environment. However, in my local machine the browser displays this error.
And as I've just mentioned, this ...
0
votes
0
answers
49
views
how can i make a nested animation in framer motion?
i started using framer-motion 3 days ago, i tried making a dropdown menu which has a dropiing animation, the menu contains a list that has a slide animation, it slides when changing the menu as a ...
0
votes
0
answers
45
views
which interstitial ad event tracks when an impression is counted by admob?
https://www.npmjs.com/package/@capacitor-community/admob#resumebanner
None of the description explain which counts as an impression that contributes to revenue.
The ad type is interstitial.
The plugin ...
0
votes
1
answer
63
views
Next.JS monorepo not loading correct assets when switching zones (Loading Chunk Error)
I have multiple projects set up in a monorepo. I load all of them and browse out to Shared to load the initial layout. However, when I click a link to go to a different zone/app Customer, I receive ...
1
vote
0
answers
71
views
Vue watch triggers on route change
I’m working on a Nuxt 3 project and encountering an issue with the watch property. I’m watching $route.query, and whenever a query parameter changes, I call an API to fetch data.
The problem is that ...
0
votes
1
answer
59
views
How to handle E2E API Request in Backend correctly?
I have set up an api backend using FastAPI. Backend testing has been done already. But I don't know how to test the frontend correctly which is usign the api. Because I want at least one test that is ...
0
votes
0
answers
44
views
404 for NEXT JS dynamic routes on Vercel production deployment
I am stuck on a frustrating behavior on my next js app which I recently deployed to vercel production environment. Basically all pages are loading except my SSR page that uses dynamic routes.
Also ...
-4
votes
1
answer
117
views
'toast.success' is not working in my signup form [closed]
I'm trying to implement a signup form and using the react-toastify package to show success and error messages. While the toast.error function works perfectly, the toast.success function does not ...
1
vote
2
answers
236
views
How to scale always-changing HTML text to fit on mobile screen
The Goal
I receive a weather forecast from the NWS that has a very particular HTML formatting that I want to preserve. A forecast will always change in both its length and its width. I want to scale ...
1
vote
2
answers
119
views
How to limit tailwind CSS to a specific react component
I am currently new to Tailwind CSS and figuring out why my login component CSS classes are also applied to every other component as well, I've tried scoping this CSS classes with modules as well but ...
0
votes
0
answers
32
views
Tailwind CSS is not working in Next JS project [duplicate]
I recently initiated a Next JS project and also installed ShadCN ui with it. By default every Next JS project comes with tailwind css and it was at first working but as soon as I started adding ShadCn'...