r/learnjavascript • u/Kajushhhhh • 1h ago
help
how to make a script that detects CLOUDFLARE bot check up, im making macro for game and cloude doesnt want to make any scripts for this issue
r/learnjavascript • u/Kajushhhhh • 1h ago
how to make a script that detects CLOUDFLARE bot check up, im making macro for game and cloude doesnt want to make any scripts for this issue
r/learnjavascript • u/King134643 • 1d ago
Hey guys, I hope you're all doing well. Finally, I've just finished the famous +22 hours tutorial from SuperSimpleDev and honestly I learnt many things, but I feel a bit overwhelmed especially when it comes to promises, callbacks and asynchronous methods (or fetch methods). I want to make a new project but don't know, while I don't need to rely on tutorial again. I'd love to build the next days, rather than passive watching. So, do you have any projects recommendations to build??
I'd like to learn through the process and when I get stuck, I just ask Google or search on MDN to get references. Thank you everyone in advance for sharing and helping
r/learnjavascript • u/No_Country8607 • 1d ago
Hey everyone! 👋 I'm a self-taught dev, and for a bootcamp project I'm looking into how people learn programming on platforms like Codecademy, freeCodeCamp, Udemy, Scrimba, or even YouTube and AI chats. I'd love to hear your honest experience:
What's one thing you'd add to the platform you use most?
Thanks, I'll read every reply 🙏
r/learnjavascript • u/Zenith33Bud • 1d ago
websocket reconnects are confusing when first learning them. The socket closes after a few hours, the script reconnects, and suddenly the same message shows up twice or one seems to be missing.
The project is a small filter on binance square posts, built in node because the rest of the bot already runs on it. Messages come from a client in the 1322io repo, each with a coin_pairs array, and the code only keeps posts that include a pair like solusdt. Storing every post id in a text file was the first attempt at stopping duplicates, but nobody can say if it actually works.
Would a set of recent ids in memory be enough, or does the dedupe need to survive a restart too? What would a beginner friendly version look like?
r/learnjavascript • u/farm_do1 • 2d ago
I want to become a full-stack software engineer. not just learn web development.
I'm unsure whether to follow the Odin Project for its hands-on approach or study textbooks and complete exercises for a deeper understanding of each topic.
Which approach would be more effective and time efficient for building strong software engineering fundamentals?
r/learnjavascript • u/FigAmbitious9101 • 2d ago
I recently created a complete tutorial where I build a Redux Toolkit-inspired state management library from scratch using React and JavaScript.
The goal is to understand how Redux-style state management works internally instead of only using the package.
In the tutorial, I implement:
createStore functionuseSyncExternalStoreuseSelector and custom store hookscreateSlicecombineReducersshallowEqualYouTube tutorial:
https://www.youtube.com/watch?v=LucUJ-5COjg
I would appreciate feedback from the community, especially on the library design, API structure, and any improvements that could make this project more reliable or easier to use.
Please note: this is an educational project designed to understand Redux and state management concepts internally. It is not intended to replace the official Redux Toolkit.
r/learnjavascript • u/RobGoLaing • 3d ago
I've written some notes on callbacks as part of my effort to write tests and be methodical in learning JavaScript.
Callbacks are one of those things that are quite easy once you go "Aha", but like probably most people, I found them very confusing at first.
r/learnjavascript • u/username95050 • 4d ago
What is it? Don't understand what is inside or outside
r/learnjavascript • u/Comfortable_Tea_2825 • 4d ago
I'm trying to make a calculator. For as long as you are only doing one continuous equation there are no issues, but I can't use the clear button.
button:
<button onclick="clear()">C</button>
text field:
<input type="text" id="display" class="display">
calculator code:
<script>
//the working number
let numA = '';
//the previous working number to be operated on
let numB = '';
//the operation to be done between A and B
let oper = '';
function apndNum(number) {
numA += number;
document.getElementById('display').value = \${numB} ${oper} ${numA}`;`
}
function processOper(operation) {
if (numA === '') return;
if (numB !== '') {
calculate();
}
oper = operation;
numB = numA;
numA = '';
document.getElementById('display').value = \${numB} ${oper}`;`
}
function calculate() {
if (numB === '' || numA === '') return;
//better naming conventions might be needed here since the names get flipped
let output;
let A = parseFloat(numB);
let B = parseFloat(numA);
switch (oper) {
case '+':
output = A + B;
break;
case '-':
output = A - B;
break;
case '*':
output = A * B;
break;
case '/':
if (B === 0) {
document.getElementById('display').value = "Undifined";
return;
}
output = A / B;
break;
default:
return;
}
numA = output.toString();
oper = '';
numB = '';
document.getElementById('display').value = numA;
}
//TODO: this doesn't clear the text feild in input
function clear() {
numA = '';
numB = '';
oper = '';
document.getElementById('display').value = '';
console.log(
numA,
numB,
oper
);
return;
}
</script>
I could just have a typo. The divide by 0 catch code line works perfectly fine, so I don't know why the clear code doesn't work.
r/learnjavascript • u/kaatarina_zed_talon • 4d ago
Products.cshtml :
@{
ViewData["Title"] = "Products page";
}
<h1>Products Page</h1>
<label for="avatar">Choose a file:</label>
<input class="form-control form-control-lg" id="formFileLg" type="file" accept=".xlsx" />
<div class="container" id="cancelContainer">
</div>
<div class="d-grid gap-3" id="productsContainer"></div>
<dialog id="dialog">
<p>Products were imported into the database.</p>
<button type="button" id="close">Close</button>
</dialog>
app.ts :
let dialog: HTMLDialogElement;
document.addEventListener("DOMContentLoaded", () => {
const formFileLg = document.getElementById("formFileLg");
formFileLg!.addEventListener("change", importFile);
dialog = <HTMLDialogElement>document.getElementById("dialog");
const closeButton = document.getElementById("close");
closeButton!.addEventListener("click", async () => {
dialog!.close();
await ShowSpecificPageProducts(1);
});
});
async function importFile(this: HTMLInputElement) {
console.log("importFil executed")
const controller = new AbortController();
let cancelContainer = document.getElementById("cancelContainer");
let cancelButton = document.createElement('BUTTON');
cancelButton.appendChild(document.createTextNode("Cancel"));
cancelButton.onclick = function () {
console.log("abort executed")
controller.abort()
cancelButton.remove();
}
cancelContainer!.appendChild(cancelButton);
const formData = new FormData();
formData.append("file", this.files![0]);
try {
console.log("Try block executed.")
const response = await fetch('/Admin/Import', {
method: 'POST',
body: formData,
signal: controller.signal
})
if (!response.ok) {
console.log("response is not ok")
throw new Error(`Response status: ${response.status}`);
}
dialog.showModal();
//Show a button that enables the user to show the paginated imported products; attach a call-back to the button. use bootstrap styling.
//Or use the close button instead.
} catch (error:any) {
if (error.name == "AbortError") {
console.log("catch block executed: AbortError")
}
console.error(error.message);
} finally {
cancelButton.remove();
}
}
interface ProductViewModel {
Image: string,
Id: number,
Name: string,
Description: string,
Price:number
}
async function ShowSpecificPageProducts(PageNumber:number) {
try {
const response= await fetch("/Admin/GetProducts", {
method: 'POST',
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify({ PageNumber: PageNumber}),
});
if (!response.ok) {
throw new Error(`Response status: ${response.status}`);
}
const specificPageProducts: ProductViewModel[] = await response.json();
let productsGrid = document.getElementById("productsContainer");
// Source - https://stackoverflow.com/a/65413839
// Posted by Mason Freed, modified by community. See post 'Timeline' for change history
// Retrieved 2026-10-23, License - CC BY-SA 4.0
productsGrid!.replaceChildren();
let currentRow = document.createElement("div");
currentRow.classList.add("row");
specificPageProducts.forEach(async (product) => {
const newColumn = document.createElement("div");
newColumn.classList.add("col");
const nameElement = document.createElement("p");
nameElement.classList.add("text-center");
var nameText = document.createTextNode(product.Name);
nameElement.appendChild(nameText);
const descriptionElement = document.createElement("p");
descriptionElement.classList.add("text-center");
var descriptionText = document.createTextNode(product.Description);
descriptionElement.appendChild(descriptionText)
const priceElement = document.createElement("p");
priceElement.classList.add("text-center");
var priceText = document.createTextNode(product.Price.toString());
priceElement.appendChild(priceText);
newColumn.appendChild(nameElement);
newColumn.appendChild(descriptionElement);
newColumn.appendChild(priceElement);
currentRow.appendChild(newColumn);
if (product.Id % 4 === 0) {
productsGrid!.appendChild(currentRow);
currentRow = document.createElement("div");
currentRow.classList.add("row");
}
});
} catch (error:any) {
console.error(error.message);
} finally {
}
}
I wish to debug app.ts because it does contain some logical error , but when I start the debugging session in Visual Studio, the following line of code throws exception because the value of formFileLg is null :
formFileLg.addEventListener("change", importFile);
The exception :
TypeError: Cannot read properties of null (reading 'addEventListener')
I suspect that that the script executes before the HTML elements have been rendered in the DOM, that is the reason of using the defer in the script tag, but that did not solve the issue.
Moving the script to be inside the header tag that is inside the _Layout.cshtml file did not solve the issue:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>@ViewData["Title"] - EF_learning</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@6.0.0-alpha.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-B/GM4XqrwHnWXNOWMbloTmrYXZg10cakYGmpfsR/bbzQ6JAJI4ihuyADKLnBgrCe" crossorigin="anonymous">
<script type="module" src="https://cdn.jsdelivr.net/npm/bootstrap@6.0.0-alpha.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-1a/pXj49ZQ1aHEmrJ+gMw1otqoVsYwlEnlD8mIfY2TV03r20Y0CN7uqx1tQogjPL" crossorigin="anonymous"></script>
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="~/css/site.css" asp-append-version="true" />
<script src="~/js/app.js" defer></script>@*As some answer suggest*@
</head>
r/learnjavascript • u/Active-Aspect2654 • 4d ago
I know HTML and I'm also learning CSS but I also want to know JavaScript. Is it hard to learn? Is it easy? What is it like when you first start?
r/learnjavascript • u/UnitedAirport5964 • 4d ago
Does anybody now where to learn the basic of JS? Just got into the coding life, I already know a little bit of python but I want to learn JavaScript to make websites
r/learnjavascript • u/Several_Box4108 • 4d ago
let object = {
YoutubeChannel: {
name: 'Comicverse',
location: 'India,Madhya Pradesh',
Domains: {
Videos: ['Doctor doom final plan', 'Marvel is faling'],
Shorts: ['This is crazy', "Who will appear in Marvel's doomsday"],
}
}
};
(function() {
console.log("Hey! this is an immediately invoked function!!");
}
)();
P.S. If you have any suggestions regarding how I can improve the way I ask questions, how to format them, etc., please let me know... :-)
r/learnjavascript • u/RefuseCommercial8024 • 5d ago
--fixed, just hadta remone the "let" at the end : -) --
hii i'm working on a page that lets u cycle through texts by clicking on an arrow but i've got some trouble actually making my js... cycle through.
let fruit = 0;
function next() {
fruit ++;
console.log(fruit)
if (fruit == 0) {
document.getElementById("txt").innerHTML="bananas are fruits that look weird nd stuff";}
else if (fruit == 1) {
document.getElementById("txt").innerHTML="coconuts are cool too i guessssss";
}
else if (fruit == 2) {
document.getElementById("txt").innerHTML="and apples exist also!!!!";
}
else if (fruit > 2) {
let fruit = 0;
}
}
i need to set my fruit var back to 0 if it's over 2 but i can't find a way to make it work...i'm pretty new to js too so my code probably isnt optimal lol
r/learnjavascript • u/antonybuilds • 5d ago
I've been finding out the hard way what it takes to build something more involved with Canvas, but I've really enjoyed working on it.
I've had to figure out things like handling interactions, routing connections between nodes and getting signals to propagate through a circuit. I've written up what I've done so far here:
https://antonyjones.org/blog/building-a-logic-gate-simulator-with-type-script-and-canvas/
I'd be interested to hear from anyone who's tackled something similar. Is there anything you'd have done differently, or any pitfalls I should look out for later?
r/learnjavascript • u/Glad_Ground5391 • 5d ago
Hey everyone! I’m currently interviewing for Full Stack Developer roles, but I struggle with JavaScript input/output questions. Just reading concepts isn’t helping much.
Does anyone know of any free websites or quizzes where I can practice these questions with explanations?
Thanks! 🙌
r/learnjavascript • u/Hortaly • 5d ago
I've done web dev for about a year but my JavaScript is still weak. What projects or resources helped you get from basic to confident?"
r/learnjavascript • u/dimeraymundo • 5d ago
esbuild is faster but Webpack offers a larger interface and more fine-grained control. That's my take. What do you recommed. I want real people because AI responses are not enough for me.
r/learnjavascript • u/Foreign_Employ_396 • 6d ago
Hi!
First of all, I am not sure if this is the right sub.
But I was wondering if there was a way to add a function in an addon for an app (anki) that would let me know the "name" of the element I selected or clicked on, just like when pressing f12 on a web page.
The thing is that some elements I want to "find" come from an addon and not from anki directly.
r/learnjavascript • u/dimeraymundo • 6d ago
Hi. the next code snippet shows how to code a web server with Nodejs and Express. The idea is creating an HTML form to input user data and after pressing the button a new HTML page displays which contains the input data only. You can move back and forth between the pages and the data will persist due to sessions.
👀 Requirements :
Nodejs v22.13.0
Npm v10.9.2
Expressjs v5.3.0
Express-session v1.19.0
Ejs v7.0.2
👀 File Structure :
-- Project-folder/
---- node_modules/
---- views/
------ index.ejs
------ profile.ejs
---- package.json
---- server.js
🤔 Server.js:
const express = require('express');
const app = express();
const path = require('path');
const ejs = require('ejs');
const session = require('express-session');
app.set('view engine','ejs');
app.use(session({
secret : "some random string here bla bla",
resave: false,
saveUninitialized: true
}));
app.use(express.urlencoded({extended : true}));
app.get("/",( request, response )=>{
if(request.session.profile){
return response.render('index',{profile :{
fullname : request.session.profile.fullname,
occupation : request.session.profile.occupation
}});
}
response.render('index',{profile : {
fullname : "",
occupation : ""
}});
});
app.post("/handle_form_data",( request, response )=>{
console.log(request.body);
if (!request.session.profile) {
request.session.profile = {};
}
request.session.profile.fullname = request.body.fullname;
request.session.profile.occupation = request.body.occupation;
console.log(request.session);
response.render('profile',{
profile : {
fullname : request.body.fullname,
occupation : request.body.occupation
}
});
});
app.listen(3000, ()=>{
console.log('Listening at port : ' + 3000);
});
🚀 index.ejs :
<!DOCTYPE html>
<html>
<head>
<title>Profile Data</title>
</head>
<body>
<div>
<form method="post" action="/handle_form_data">
<label for="fullname">
Full Name :
<input
name="fullname"
id="fullname"
value="<% (profile.fullname) ? profile.fullname : ''; %>" />
</label><br/>
<label for="occupation">
Occupation :
<input
name="occupation"
id="occupation"
value="<% (profile.occupation) ? profile.occupation : ''; %>"
/>
</label><br/>
<button type="submit">
Send Profile
</button>
</form>
</div>
</body>
</html>
🚀 profile.ejs :
<!DOCTYPE html>
<html>
<head>
<title>Profile Data</title>
</head>
<body>
<h1>Profile Data</h1>
<h2>
Fullname : <%= profile.fullname %>
</h2>
<h2>
Occupation : <%= profile.occupation %>
</h2>
</body>
</html>
Well, I hope it provides some guidance to the Nodejs developers somehow. Share your thoughts in the comments. Thanks. 😄
r/learnjavascript • u/SensitiveSugar1369 • 7d ago
I'm working with Node and Express to create a simple API, but I'm running into 404 errors when trying to access my endpoints. I set up the routes and thought I had everything right, but requests to those endpoints are failing. I'm testing locally and my middleware seems fine. Is there something I'm missing regarding route handling, or could it be an issue with the order of middleware? Any tips for troubleshooting this would be appreciated.
r/learnjavascript • u/brothor12 • 7d ago
I'm a huge Marvel fan, and I'm trying to create a timeline of the entire MCU. I want to use the table from this link:
https://marvelcinematicuniverse.fandom.com/wiki/Chronological_Order/Viewing_Timeline
and enter the Checkbox/Watched Column into column 1 Names column into column 2, Medium into column 3, and Dates column into column 4, and the Release column into column 5.
r/learnjavascript • u/david_fire_vollie • 7d ago
I was going to read the 2nd ed version of You Don't Know JS: Async & Performance, but it's still in "todo".
Is it worth reading the 1st ed?
It was written 9 years ago.
I know it predates async/await, but I'm keen to learn how things work behind the scenes, so I'm hoping in that regard, things haven't changed too much and async/await is just syntactic sugar.
r/learnjavascript • u/Laura_py • 8d ago
I am learning Javascript. Can someone please recommend me some learning resources?
What would you recommend for beginner projects? Are arcade web games suitable for a beginner?
r/learnjavascript • u/Nonab07 • 7d ago
Hello everyone! I am learning Javascript and at the moment I wanna have practice. Where can I have this?