A general chat about JavaScript. Ask anything you like or share your best cat picture. Please check Google/StackOverflow for answers before asking for help. And remember, be nice! Don't ask to ask, just ask
items.add expression as the second argument to the final then, which is almost certainly not what you want. You can try this instead:extend(CommentPost.prototype, 'headerItems', function (items) {
const giveMeInfo = fetch("https://ipinfo.io/json?token=mykey")
.then((response) => response.json())
.then((data) => {
this.ipInfo = data;
console.log(this.ipInfo.country)
const flagImage = 'http://purecatamphetamine.github.io/country-flag-icons/3x2/' + data.country.toUpperCase() + '.svg';
items.add(
"ipinfo",
<div className="ipinfo" id="countryCode">{this.ipInfo.country}</div>
);
});
});
Review and comments are welcomed
TC39 forum link : https://es.discourse.group/t/timeout-for-an-async-loop-if-loop-do-not-finishes-before-timeout-it-will-break-anyway/1021/8
RegExp.prototype.test is standard.
jashkenas/underscore#2947
Hello guys. I need help with a HTML structure. I have a header tag which is styled as a flexbox. It has two contents: a picture to the left and navigation links to the right. Now I want to introduce a line in the middle of the picture and the navigation link and the way I am going about it is to use flexbox order. For example:
.nav{ position: relative;
order: 0;
//other styles}
.nav::after{
content: '';
display: block;
height: 1px;
flex: 1 1 auto;
width: 100%;
background: #fff;
order: -1;
}the result should produce a line between the picture icon on the left hand side and the navigation container on the right hand side, but the line ends up in the navigation container(i.e the .nav class) instead of outside it. It's confusing how this is happening so I'd like a second pair of eyes to help solve it. Thanks.
::after and ::before always go inside the matching element rather than outside it. You can attach the pseudoelement to the header element instead.
2 replies
https://torre.bio/api/bios/ and I usually get this error Access to XMLHttpRequest at 'https://torre.bio/api/bios/john' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. on close investigation at the network tab I found out that any time I hit the above url I am being redirected to https://bio.torre.co/api/bios. Which seems to show that I may need a proxy server backend to handle access to this url. I have searched and nothing comes close to a solution. A stackoverflow respose "https://stackoverflow.com/questions/70114502/access-to-xmlhttprequest-at-from-origin-http-localhost4200-has-been-bloc " is a close answer but it was implemented with .Net. My app codebase is in react and I need help on setting up a proxy server to consume the API above. Thanks.
3 replies
Hi guys, I'm reaching to ask for a little help. I'm working through the codecademy js course and I've just done this task.
function monitorCount(rows, columns) {
return rows * columns;
}
function costOfMonitors(rows, columns) {
return monitorCount(rows, columns) * 200;
}
const totalCost = costOfMonitors(5, 4);
console.log(totalCost);I want to check my understanding of how js handles the data and what the call stack status is during the evaluation. I think I have a good idea, but I'd like your feedback in case I've missed something or I'm totally wrong..
22 replies
Whats this operator called? (Double exclamation mark)
return !!(confirmOne && confirmTwo);
Whats this operator called? (Double exclamation mark)
return !!(confirmOne && confirmTwo);Edit: https://stackoverflow.com/questions/9284664/double-exclamation-points
Whats this operator called? (Double exclamation mark)
return !!(confirmOne && confirmTwo);Edit: https://stackoverflow.com/questions/9284664/double-exclamation-points
Makes logical sense, but was hard to read. Noob mistake
The discussion stack overflow is why? I did think of one case that might apply.
if you wanted to place a boolean into a value in an object from the existence of a value in a variable
{
value: anObject,
exists: !!anObject
}I believe this will ensure that exists becomes a boolean value
Hi everyone, I have been doing a really cool John Smilga project (the Reviews project https://www.youtube.com/watch?v=3PHXvlpOkf4&t=2736s&ab_channel=freeCodeCamp.org) and would like to check my understanding..
Starter files
const reviews = [ {
id: 1,
name: "susan smith",
job: "web developer",
img:
"https://res.cloudinary.com/diqqf3eq2/image/upload/v1586883334/person-1_rfzshl.jpg",
text:
"I'm baby meggings twee health goth +1. Bicycle rights tumeric chartreuse before they sold out chambray pop-up. Shaman humblebrag pickled coloring book salvia hoodie, cold-pressed four dollar toast everyday carry",
},
{object 2} etc];
const img = document.getElementById('person-img');
let currentItem = 0;We have a DOM with an image in, which of course has a src attribute..
When the html loads we are running this so far...
window.addEventListener('DOMContentLoaded', function(){
const item = reviews[currentItem];
img.src = item.img;
})I can see that img in this case refers to our getElementById variable, but I wanted to check about the .src part.
src is an attribute, but it seems to be being used as a property. The dot notation is selecting it? Is this correct?
item.img is pointing to the array index 0, but when it says .img it's reaching into the object property for img. Am I correct?
So when it says img.src = item.img it means that the source of the img variable should equal the value of the img property within the array?
Sorry for the waffling, but this is baffling me!
