We want to use Next.js for our application but we would be using mainly client side rendering for fetching data. The API is an external API will built that we would be calling. Only the homepage will be using server…
I am trying to connect to my online redis database. const redis = require('redis'); const client = redis.createClient({ password: '<password>', socket: { host: <host> port: <port> } }); client.on('connect', function() { console.log('client connected'); }); client.on('error', function(err) { console.error('Error connecting to…
I am trying to get the current page from the layout.txt file but when I put 'use client' at top of the page I get the following errors: Uncaught SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the…
I have an Avatar component which is being passed a non-null url. I'm trying to set the initial value of avatarPath to this url but avatarPath is null. import { useState } from "react"; export default function Avatar({ uid, url,…
I was trying to add different styles for a component in react nect.js. Below I've mentioned my code for button component import styles from "./button.module.css"; const Button = props =>{ return( <div> <button className={styles.button}>{props.text}</button> </div> ) } export default Button;…
I have developed a serverless application using next.js, Vercel, and Google Sheets. I am using Google sheets to save customer contact data. My application logic works fine locally during production. I am receiving the data successfully in my google sheet…
I'm integrating Firebase Cloud Messaging, and it is required to have firebase-messaging-sw.js file inside the public folder as a service worker. The file needs to have my firebase config, which I of course want to hide the details of in…
I have trying to implement a simple counter component that will increase the count of the state variable when a button is clicked, so i made a separate file Couter.tsx and placed into the component folder in the root of…
I currently have the following React Query implementation: const { data, isSuccess, isLoading } = useQuery(['myQuery', myParams], async () => { return myAjaxCall(myParams); }, { cacheTime: 0 }); And I pass the results returned into a custom component: <Results foundRecords={data}/>…
I found a problem, that I can't explain myself. Short story long: I tried to build a native draggable slider with react and positioned it in the middle of the screen. At least in my Codesandbox file. There I used…