These are chat archives for FreeCodeCamp/HelpFrontEnd

18th
Sep 2017
andoreilly
@andoreilly
Sep 18 2017 00:50
Im trying to center an image on a page using bootstrap the code can be seen here ......... <img src="https://i.imgur.com/spMJmzj.jpg" alt="pic" class ="img-responsive center-block"> the <img> is inside my container but the image wont center under my nav bar any ideas why? any help would be much appreciated :)
roughnut
@roughnut
Sep 18 2017 00:55
@andoreilly This comes from Stack Overflow. Remove “center-block” and put:
.img-responsive {
margin: 0 auto;
}
in your CSS
andoreilly
@andoreilly
Sep 18 2017 01:13
thank you for your reply i saw that on SO but it did not work.When i go >inspect >click select element on page and hover my mouse to the right of the image there is around 400px of blank space
the wrapper div is centered in the container div but i need the image to be center in my wrapper div
sorry if im not explaing too well
Ken Haduch
@khaduch
Sep 18 2017 01:18
@andoreilly - which bootstrap version are you using? img-responsive went away in Bootstrap V4, if you happen to be using that...
andoreilly
@andoreilly
Sep 18 2017 01:20
Hi Ken. Oh really? i just c&p the Bootstrap CDN from the website about two hours ago so i guess the most recent!
im going to look more in the Docs
Ken Haduch
@khaduch
Sep 18 2017 01:21
@BrianWilliams28 - you just need to put some optional whitespace characters in key places in your expression. You don't need any of the match.length or other testing that you are doing, if you get the expression to fully reflect all of the cases that they put in the tests. (This is re: :point_up: September 17, 2017 3:53 PM - I'm just getting back to the computer after a day away - perhaps you already have resolved all of this?)
@andoreilly - which version did you use, though? V3 or V4? They took img-responsive and made a lot of other changes in Bootstrap V4. There are equivalent new classes in V4. You can find more details in this document. The img-responsive change is at this link
andoreilly
@andoreilly
Sep 18 2017 01:24
Thank you Ken worked 100%.
Alex
@cyberpunk1971
Sep 18 2017 01:38
Hi all. I was wondering if someone could explain in more detail about global variables
var myGlobal = 10 Did I initialize or define that variable? I'm a little confused on that.
ok nvm, i just answered my own question
Alex
@cyberpunk1971
Sep 18 2017 02:23
Can someone help me with a javascript question please?
Gersho
@Gersho
Sep 18 2017 02:23
if it's within my knowledge$
Alex
@cyberpunk1971
Sep 18 2017 02:24
is function(num) a thing in js?
Gersho
@Gersho
Sep 18 2017 02:24
you mean anonymous functions ?
Alex
@cyberpunk1971
Sep 18 2017 02:25
idk
i'm going through the lessons
the solution was easy, basically given to you, but I just want to know how it was arrived at
Gersho
@Gersho
Sep 18 2017 02:26
you mean the fact that it's
function(arg){
//do things
}

instead of 
function myFunction(arg){
//do things
}
could you link the lesson please ?
or give it's name
Alex
@cyberpunk1971
Sep 18 2017 02:27
sure hang on
Gersho
@Gersho
Sep 18 2017 02:27
ok
so your question is about what part ?
this one ?
changed = change(10);
Alex
@cyberpunk1971
Sep 18 2017 02:29
well first, is processed = processArg(7); a global variable?
or a variable at all?
that's the solution
Gersho
@Gersho
Sep 18 2017 02:29
processed is a variable
processArg is a function (called with () )
Alex
@cyberpunk1971
Sep 18 2017 02:30
ah ok, i just reallized that haha
Gersho
@Gersho
Sep 18 2017 02:30
processed was declared on line 12, it's part of the main body of the script so yes it is a global variable
Alex
@cyberpunk1971
Sep 18 2017 02:30
so, processed has already been assigned a variable is that correct
ok
it's value is 0, correct?
Gersho
@Gersho
Sep 18 2017 02:31

the line evaluates as:
the variable processed is equal to the result of the function processArg when we give it an argument of 7

we then need to check what happens in the function

function processArg(num) {
  return (num + 3) / 5;
}
so the function return as result (7+3)/5
so that would be 2
Alex
@cyberpunk1971
Sep 18 2017 02:32
is that because the global is evaluated first?
if that's the correct term
Gersho
@Gersho
Sep 18 2017 02:33
the function is evaluated first, so we can know what to put in the variable processed
scope (the "range" of a variable) is relevant to know if you can access it, it doesn't affect priority of events
Alex
@cyberpunk1971
Sep 18 2017 02:34
well if the function is eval first, how does it know to include 7?
Gersho
@Gersho
Sep 18 2017 02:34
oooh
i understand
Alex
@cyberpunk1971
Sep 18 2017 02:34
maybe i can explain my question better5
better
Gersho
@Gersho
Sep 18 2017 02:34

when we write

function processArg(num) {
  return (num + 3) / 5;
}

the function is established, but not called

Alex
@cyberpunk1971
Sep 18 2017 02:34
so, it's basically waiting for information?
which we give it
Gersho
@Gersho
Sep 18 2017 02:35
it's waiting to be called, and it need an argument (7) in this case
Alex
@cyberpunk1971
Sep 18 2017 02:35
in the form of processed = processArg(7);
Gersho
@Gersho
Sep 18 2017 02:35
yes, because we want that result to go to processed
Alex
@cyberpunk1971
Sep 18 2017 02:35
ok
now, the other part of my question...........
the function(num) is waiting for info, which is 7
Gersho
@Gersho
Sep 18 2017 02:37
well it's not really "waiting" it's just that until it's called, it's code is not run
Alex
@cyberpunk1971
Sep 18 2017 02:37
and then the cpu says, "I need to print out the answer to (7 + 3) / 5"
Gersho
@Gersho
Sep 18 2017 02:38
and put it in that variable
Alex
@cyberpunk1971
Sep 18 2017 02:38
and that is where function(num) comes into play
Gersho
@Gersho
Sep 18 2017 02:38
yes, it calls the function
Alex
@cyberpunk1971
Sep 18 2017 02:38
i think I understand it now. you're awesome dude
thanks @Gersho
CamperBot
@camperbot
Sep 18 2017 02:38
cyberpunk1971 sends brownie points to @gersho :sparkles: :thumbsup: :sparkles:
:cookie: 439 | @gersho |http://www.freecodecamp.com/gersho
Gersho
@Gersho
Sep 18 2017 02:39
you can call it multiple times
var blabla = processArg(5);
var foo = processArg(8);
Alex
@cyberpunk1971
Sep 18 2017 02:39
another question I have is where/when would I use something like this?
is this for front end? back end? or what?
Gersho
@Gersho
Sep 18 2017 02:39
don't worry you'll see plenty of those
it's a basic of coding, it'll be everywhere
Alex
@cyberpunk1971
Sep 18 2017 02:39
ok
Gersho
@Gersho
Sep 18 2017 02:40
it's usefull to reuse code
Alex
@cyberpunk1971
Sep 18 2017 02:40
so is processArg a common term?
Gersho
@Gersho
Sep 18 2017 02:40
for exemple my exemple earlier
no i was reusing your exemple ^^
Alex
@cyberpunk1971
Sep 18 2017 02:40
ok
Gersho
@Gersho
Sep 18 2017 02:40
you name your function as you want it (preferably something to know what it does)
Alex
@cyberpunk1971
Sep 18 2017 02:40
is function(num) a common term?
Gersho
@Gersho
Sep 18 2017 02:41
the use of a function like that is to re-use it, this one is only 1 line, but if you have a lot, you don't want to retype it)
function is a keyword
Alex
@cyberpunk1971
Sep 18 2017 02:41
ok
i was wondering if (num) was common
Gersho
@Gersho
Sep 18 2017 02:41
the values in the () are usually called arguments (you can have multiple)
Alex
@cyberpunk1971
Sep 18 2017 02:41
i seem to remember something like that is was
ok
i'm pretty new to js
but learning more and more
been studying every night
do u work as a programmer?
Gersho
@Gersho
Sep 18 2017 02:43
like
function addNumbers (a,b,c){
return a+b+c;
}
var blabla = addNumbers(2,4,6);
console.log(blabla); // 12

do u work as a programmer?

i wish ^^i'm still learning too

Alex
@cyberpunk1971
Sep 18 2017 02:44
i see
have you been applying?
Gersho
@Gersho
Sep 18 2017 02:47
no yet i'm trying to move out of where i live, it's a small island (on a path you surely seen on the news lately)
Alex
@cyberpunk1971
Sep 18 2017 03:02
oh wow
damn dude that sucks
thank God you're ok
Gersho
@Gersho
Sep 18 2017 03:04
got nothing here but neighbour islands weren't so lucky, Maria is for tomorrow
rafaelmonroy
@rafaelmonroy
Sep 18 2017 06:27
how can I get my return to be in the proper format for the DNA pairing challenge?
function pairElement(str) {
  var obj = {A:'T', T:'A', C:'G', G:'C'},
      array = str.split(''),
      holderArr = [];
  for (i=0;i<array.length;i++){
    for (var j in obj){
      if (array[i] === obj[j]){
        holderArr.push(array[i] +','+ j );
      }
    }
  }

  return holderArr;
}

pairElement("ATCGA");
right now it returns [[“A,T”],…] but it needs to be [[“A”,"T”],…]
Markus Kiili
@Masd925
Sep 18 2017 06:31
@rafaelmonroy Maybe holderArr.push([array[i],obj[array[i]]]);
rafaelmonroy
@rafaelmonroy
Sep 18 2017 06:32
@Masd925 YES ! that worked thanks man
CamperBot
@camperbot
Sep 18 2017 06:32
rafaelmonroy sends brownie points to @masd925 :sparkles: :thumbsup: :sparkles:
:star2: 4488 | @masd925 |http://www.freecodecamp.com/masd925
rafaelmonroy
@rafaelmonroy
Sep 18 2017 06:32
@Masd925 lol so just another for or while loop instead?
Markus Kiili
@Masd925
Sep 18 2017 06:32
@rafaelmonroy You don't need the for in loop at all there.
Just remove the for...in loop and the if.
rafaelmonroy
@rafaelmonroy
Sep 18 2017 06:35
@Masd925 ohh yeah, that works too
Markus Kiili
@Masd925
Sep 18 2017 06:36
@rafaelmonroy No need to loop the properties, when you can just access.
rafaelmonroy
@rafaelmonroy
Sep 18 2017 06:37
@Masd925 this is the part that returns the pair correct? obj[array[i]]
Markus Kiili
@Masd925
Sep 18 2017 06:38
@rafaelmonroy Yes. array[i] is the character and obj[array[i]] gets the character pair from the obj.
rafaelmonroy
@rafaelmonroy
Sep 18 2017 06:38
@Masd925 thanks!
Ebinezar Dhanaraj
@Ebiislearning
Sep 18 2017 09:16

I have been using an web app which lists a set of records, I want certain information available on all the records to be highlighted/formatted. I am using jQuery (Tamper Monkey - Chrome plugin) to highlight/format the information that I need. However, I see that the div ids for these keeps on changing for each record and the class name remains the same.

Is there any other way to identify the divs or the classes ? Please find below the code snippet of a record.

‘’’

<div class="form-group col-sm-6" data-test-detail-field=“Bucket”>
<label class="col-sm-5 text-ellipsis" title="Infer Bucket">Bucket</label>
<div class="col-sm-7">
<div id="ember5757" class="ember-view">
<div id="ember5758" class="ember-view">
<span id="ember5759" data-original-title="D" data-placement="bottom" data-toggle="tooltip" data-container=".viewport" class="ember-view" style="word-wrap: break-word;">D</span>
</div>
</div>
</div>
</div>
‘’’

korzo
@korzo
Sep 18 2017 10:24
@Ebiislearning Which elements you need?
Ebinezar Dhanaraj
@Ebiislearning
Sep 18 2017 10:25
I need the value of the field “Bucket”, span id is ember5759, div id is ember5757
korzo
@korzo
Sep 18 2017 10:38
@Ebiislearning You can use attribute selector like
$('[id^=ember]')
Ebinezar Dhanaraj
@Ebiislearning
Sep 18 2017 10:39
there or other elements in the same page with id starting with ember.

‘ <div class="row mg-b-15">
<div class="clearfix"></div>
<div class="form-group col-sm-6" data-test-detail-field="Work">
<label class="col-sm-5 text-ellipsis" title="Work">Work</label>
<div class="col-sm-7"><div id="ember4440" class="ember-view"><div id="ember4441" class="ember-view text-muted"> Not available
</div>
</div></div>
</div>
<!----> <div class="form-group col-sm-6" data-test-detail-field="Contact Attempts">
<label class="col-sm-5 text-ellipsis" title="Contact Attempts">Contact Attempts</label>
<div class="col-sm-7"><div id="ember4443" class="ember-view"><div id="ember4444" class="ember-view text-muted"> Not available
</div>
</div></div>
</div>
<div class="clearfix"></div>
<div class="form-group col-sm-6" data-test-detail-field="Mobile">
<label class="col-sm-5 text-ellipsis" title="Mobile">Mobile</label>
<div class="col-sm-7"><div id="ember4446" class="ember-view"><div id="ember4447" class="ember-view text-muted"> Not available
</div>
</div></div>
</div>
<!----> <div class="form-group col-sm-6" data-test-detail-field="Email">
<label class="col-sm-5 text-ellipsis" title="Email">Email</label>
<div class="col-sm-7"><div id="ember4449" class="ember-view"> <a class="text-wrap" title="smitajan12@gmail.com" data-ember-action="4450">
smitajan12@gmail.com
</a>

</div></div>
</div>
<div class="clearfix"></div>
<div class="form-group col-sm-6" data-test-detail-field="Owner">
<label class="col-sm-5 text-ellipsis" title="Owner">Owner</label>
<div class="col-sm-7"><div id="ember4451" class="ember-view"><div id="ember4452" class="ember-view"> <span id="ember4453" data-original-title="Ebinezar Dhanaraj" data-placement="bottom" data-toggle="tooltip" data-container=".viewport" class="ember-view" style="word-wrap: break-word;">Ebinezar Dhanaraj</span>

</div>
</div></div>
</div>
<!----> <div class="form-group col-sm-6" data-test-detail-field="Signup Date">
<label class="col-sm-5 text-ellipsis" title="Signup Date">Signup Date</label>
<div class="col-sm-7"><div id="ember4455" class="ember-view"><div id="ember4456" class="ember-view"> <span id="ember4457" data-original-title="Fri Sep 15, 2017" data-toggle="tooltip" data-placement="bottom" data-container="body" class="text-ellipsis ember-view"> Fri Sep 15, 2017
</span>

</div>
</div></div>
</div>
<div class="clearfix"></div>
<div class="form-group col-sm-6" data-test-detail-field="Channel Manager">
<label class="col-sm-5 text-ellipsis" title="Channel Manager">Channel Manager</label>
<div class="col-sm-7"><div id="ember4459" class="ember-view"><div id="ember4460" class="ember-view text-muted"> Not available
</div>
</div></div>
</div>
<!----> <div class="form-group col-sm-6" data-test-detail-field="Infer Bucket">
<label class="col-sm-5 text-ellipsis" title="Infer Bucket">Infer Bucket</label>
<div class="col-sm-7"><div id="ember4462" class="ember-view"><div id="ember4463" class="ember-view"> <span id="ember4464" data-original-title="D" data-placement="bottom" data-toggle="tooltip" data-container=".viewport" class="ember-view" style="word-wrap: break-word;">D</span>

</div>
</div></div>
</div>
<div class="clearfix"></div>
<div class="form-group col-sm-6" data-test-detail-field="Customer Status">
<label class="col-sm-5 text-ellipsis" title="Customer Status">Customer Status</label>
<div class="col-sm-7"><div id="ember4466" class="ember-view"><div id="ember4467" class="ember-view"> <span id="ember4468" data-original-title="Trial" data-placement="bottom" data-toggle="tooltip" data-container=".viewport" class="ember-view" style="word-wrap: break-word;">Trial</span>

</div>
</div></div>
</div>'

so ember is there as part of every element
korzo
@korzo
Sep 18 2017 10:59
@Ebiislearning You can use direct child selector > or method .children()
$('.col-sm-7 > [id^=ember]:first-child')
Ebinezar Dhanaraj
@Ebiislearning
Sep 18 2017 11:20
Ok. Will try that out.
Thanks a lot :)
Johnny
@JohnnyBizzel
Sep 18 2017 12:40
@Ebiislearning Gist is good https://gist.github.com/
林欣荣
@golovefree24
Sep 18 2017 13:41
please,in regular expression :/[\W_]/g ,what means of underline?
korzo
@korzo
Sep 18 2017 13:52
@golovefree24 [] is group of characters
underline is literal underline
Luke-Rogerson
@Luke-Rogerson
Sep 18 2017 14:01
Guys, I'm trying to return the largest number in each nested array
I'm trying to use .map and .reduce to do this.
Antonious Stewart
@Antonious-Stewart
Sep 18 2017 14:02
who here is good at regex
Luke-Rogerson
@Luke-Rogerson
Sep 18 2017 14:02
Would anyone mind glancing at my Repl and telling me if I'm on the right track?
cowCrazy
@cowCrazy
Sep 18 2017 14:11
@Luke-Rogerson you are almost there. Just instead of trying to assign the returning value from reduce to the maxNumber var return it.
@Astewart400 wouldn't say "good" but hit me :)
Luke-Rogerson
@Luke-Rogerson
Sep 18 2017 14:15
@cowCrazy Thank you so much!
CamperBot
@camperbot
Sep 18 2017 14:15
luke-rogerson sends brownie points to @cowcrazy :sparkles: :thumbsup: :sparkles:
:cookie: 347 | @cowcrazy |http://www.freecodecamp.com/cowcrazy
Jonathan Cunanan
@jcunanan05
Sep 18 2017 14:23
hello little question. i have a function, will the code return ! _.isEmpty first and don't wait for the asynchronous call?
function isLoggedIn() {
  if (loggedInDetailsAlreadyFetched) {
    this.getLogin()
      .then();
      .catch();
  } 

  return ! _.isEmpty(userDetails);

}
Ken Haduch
@khaduch
Sep 18 2017 14:29
@jcunanan05 - is this the callback for your asynchronous call? If it is, it will not be triggered until you get a return from the call, so it should work. But if the async call is this.getLogin() then I think you will do the return of !_.isEmpty(userDetails); first, it will not wait. You should put that check within the .then() method.
Jonathan Cunanan
@jcunanan05
Sep 18 2017 14:38
@khaduch the async call is this.getLogin. :( so it won't wait. Thanks :) but if I put an else clause to the !_. isEmpty(user details) ;, will it wait?
CamperBot
@camperbot
Sep 18 2017 14:38
jcunanan05 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 3295 | @khaduch |http://www.freecodecamp.com/khaduch
korzo
@korzo
Sep 18 2017 14:41
@jcunanan05 If condition is false, then async call is not triggered.
But your function will be inconsistent
Maciej Dębowski
@debofsky
Sep 18 2017 14:55
Hello!
I have a question, don't know if it's so related to programming, or more to learning per-se and discovering, but on the edge to cheating.
Currently I'm working on "Title Case a Sentence" and I have some ideas how to tackle this problem.
However after finishing previous challenges I googled a little and found out about "cleaner" ways to solve problems. They were mostly about functional programming and using filter, map and reduce.
So far, when I think about "Title Case a Sentence" i see: applying lowercase, a loop (possibly more than one, and possibly nested), and applying uppercase. I hope I'm not spoiling anything. It's just brute-force, plain and simple, the way I like, but the code is quite long (compared to what I saw with neat solutions via previous challenges) and... let's say not elegant.
What do you think? Is it okay to google first, analaze some "perfect" solutions, and apply them on my own?
Markus Kiili
@Masd925
Sep 18 2017 15:03
@debofsky It is better to try it on your own at first and then look for better solutions. If you always look first, making code from scratch might become a problem.
Adit
@adittyagi
Sep 18 2017 15:32
Hey guys. How to use a single button to change bg-color and update the new message in random quote machine ?
Elizabeth Paul
@Kowalatam
Sep 18 2017 16:04
$("the_button").on("click", function(){
    //change background color
   //update message
})
@adittyagi
something like that if jquery
just put all u want to happen if the button is clicked
imperial-isms
@imperial-isms
Sep 18 2017 16:20
I finished everything up through intermediate projects; I’m having trouble getting through intermediate algorithms…stuck on roman numerals; tried even shifting over to https://edabit.com and doing some of the easier ones…my brain seems like it’s having trouble getting into the groove.
Do you think I should just work on something else and come back to algorithms?
Maybe I’ll be in a more ideal state tomorrow.
Christopher McCormack
@cmccormack
Sep 18 2017 16:48
@imperial-isms Roman numerals do not follow a programmatic scheme, so it's OK to create special entries for odd values like 4, 9, 40, 90, etc..
imperial-isms
@imperial-isms
Sep 18 2017 16:49
Oh okay
I stepped away from that for a bit, but I was having trouble with that aspect
That’s definitely helpful, thank you, @cmccormack !
CamperBot
@camperbot
Sep 18 2017 16:50
imperial-isms sends brownie points to @cmccormack :sparkles: :thumbsup: :sparkles:
:star2: 1215 | @cmccormack |http://www.freecodecamp.com/cmccormack
Christopher McCormack
@cmccormack
Sep 18 2017 16:51
@imperial-isms np - once you get past that it becomes much easier to digest
Dušan Todorović
@krckyboy
Sep 18 2017 17:02

Hey, fellow coders. :)

I need some help. I am trying to do a website that looks pretty much like https://wp.nkdev.info/snow/home-1/?navigation_type=default&footer_type=1 and I am just doing this for the sake of practicing, it's not going to get live, obviously.

I did the header, but I just need to tips on the image to the left of "Digital. Modern. Creative". I don't know how to zoom out, how to put the focus to the left or right, or to the bottom. How to achieve that? Basically, it's the situation as if a camera man is focusing on shoes rather on face, or something like that. How can I fix it?

My code: https://codepen.io/krcky/pen/QqyKQB

Adinarayana Raghu
@adinarayaanraghu95
Sep 18 2017 18:09
Guys if someone is interested to address some concerns of the issues which we have found, please feel free to contribute.
Help on the frontend needed. Since we have a deadline of 2 days.
https://github.com/Startversity/mozillaevent-registrationscreen
Richard
@rylew0925
Sep 18 2017 18:18
Would someone please explain to me what "match()" does?
Jan Shah
@JanShah
Sep 18 2017 18:21
'hello'.match('he')
//returns ["he", index: 0, input: "hello"]
@rylew0925
Pagnito
@Pagnito
Sep 18 2017 18:24
hey i put some meta tags on my portfolio website and my load speed becaaame sooooo slow...it takes up to 10 seconds to load sometimes when loadinh on a new device
Richard
@rylew0925
Sep 18 2017 18:24
@JanShah Thanks!
CamperBot
@camperbot
Sep 18 2017 18:24
rylew0925 sends brownie points to @janshah :sparkles: :thumbsup: :sparkles:
:cookie: 533 | @janshah |http://www.freecodecamp.com/janshah
piteto
@piteto
Sep 18 2017 18:26
@Pagnito Did you add resources from external servers that may be slowing things down?
Jan Shah
@JanShah
Sep 18 2017 18:27
@Pagnito can you share the url?
Pagnito
@Pagnito
Sep 18 2017 18:28
pavelyeganov.com
@piteto hmmm, maybe its the fonts...i can remember if i downloaded them and put them i the files or jus used a cdn
i gotta goo look again real quick
piteto
@piteto
Sep 18 2017 18:29
Not sure if this is the issue, but you're missing a closing script tag: <script type='text/javascript' src='JS/index.js' />
Also, these should be first:
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
And you're loading font awesome twice
Pagnito
@Pagnito
Sep 18 2017 18:37
shit lol
tho using this /> doesnt seem to matter as the javascript is working
piteto
@piteto
Sep 18 2017 18:37
In your browser ;)
I don't think script tags can be self closing, but I might be wrong
Pagnito
@Pagnito
Sep 18 2017 18:38
oh no thats actually two different font libraries
for some reason they both have fontAwesome
piteto
@piteto
Sep 18 2017 18:38
I would move all of your <script> tags to the end of your <body> to speed things up
Pagnito
@Pagnito
Sep 18 2017 18:38
k
piteto
@piteto
Sep 18 2017 18:39
Have you heard of the Google PageSpeed tool? https://developers.google.com/speed/pagespeed/
It will give lots of recommendations to help make things faster
Pagnito
@Pagnito
Sep 18 2017 18:40
sweet thanks @piteto
CamperBot
@camperbot
Sep 18 2017 18:40
pagnito sends brownie points to @piteto :sparkles: :thumbsup: :sparkles:
:cookie: 117 | @piteto |http://www.freecodecamp.com/piteto
Pagnito
@Pagnito
Sep 18 2017 18:41
it only seems to load slow on mobile tho, i dunno after these changes maybe it wont tho
Jan Shah
@JanShah
Sep 18 2017 18:41
@Pagnito your bottleneck is <script src="https://use.fontawesome.com/3e4f1eb361.js"></script> takes up to 5 seconds to load on my machine
Pagnito
@Pagnito
Sep 18 2017 18:41
@JanShah hmm i see
i cant rememver what that cdn is for, one is for the icons obviouscly but the other one is something else
that comes with bootstrap i belive
nop nvm not bootstrap
piteto
@piteto
Sep 18 2017 18:43
@Pagnito Those two font awesome scripts are identical, aside from the name.
Use a public CDN for the CSS file instead - it might help
Pagnito
@Pagnito
Sep 18 2017 18:44
public cdn for css file?
piteto
@piteto
Sep 18 2017 18:44
Or download that and run it locally like you're doing with bootstrap.css
It needs a bunch of font files to make that work though - can be a little painful
Pagnito
@Pagnito
Sep 18 2017 18:46
wait so ur saying cuz i have a file for bootstrap and cdn for fontawesome is messing things up?
piteto
@piteto
Sep 18 2017 18:46
There's always a risk of slow load times when getting your resources from an external server - like use.fontawesome.com.
To minimize the risk, always load your assets from the same server - in your case pavelyeganov.com
Pagnito
@Pagnito
Sep 18 2017 18:48
tho apperently those two font file are identicial huh?
Jan Shah
@JanShah
Sep 18 2017 18:49
@Pagnito there's something else, I'm sure your page is loading twice..
Pagnito
@Pagnito
Sep 18 2017 18:50
if i download em, i can just import em into css right?
how so?
piteto
@piteto
Sep 18 2017 18:50
those two files are identical aside from their names, yes
Jan Shah
@JanShah
Sep 18 2017 18:51
or some script is repeating. open chrome, developer tools, performance tab, then refresh the page with screenshots ticked
@Pagnito
Pagnito
@Pagnito
Sep 18 2017 18:53
@JanShah i removed the repeating font script, and i have no idea what im looking at after i did the performance test
loading time seems to have imporoved drstically, i just cleared all cache and history and data on my mobile browser and went back and it loaded instantly
tho my js file didnt get loaded
i redid the script tag, now gotta wait a lil to see if that will do it
Pagnito
@Pagnito
Sep 18 2017 18:59
im gonna redo my whole portfolio soon anyway, so i guess it doesnt rly matter
Jan Shah
@JanShah
Sep 18 2017 18:59
image.png
it loads something at 2 seconds and then something happens at 7 seconds, then it reloads
Pagnito
@Pagnito
Sep 18 2017 19:00
it still doing it?
it doesnt do it on my browser
or wait hold on
which indicator tells u it reloads?
Jan Shah
@JanShah
Sep 18 2017 19:02
no indicator, just screenshots that the profiler takes. last time I loaded, just now, it actually started rendering something then cleared again and reloaded at about 7 seconds
Pagnito
@Pagnito
Sep 18 2017 19:03
thats weird, it doesnt do it on my browser
Jan Shah
@JanShah
Sep 18 2017 19:04
it could be my hosting..
Pagnito
@Pagnito
Sep 18 2017 19:05
can u try going on it on ur phone?
Engjell Bislimi
@Engjell00
Sep 18 2017 19:05
any good videos that shows how to create website with html/css
Pagnito
@Pagnito
Sep 18 2017 19:05
@Engjell00 traversy media on youtube
Jan Shah
@JanShah
Sep 18 2017 19:06
doesn't look like it though, i've just tried a heavy page and it loads just fine
does the same on my phone, just faster @Pagnito
Pagnito
@Pagnito
Sep 18 2017 19:08
oh yea it just did it on mine too
it loaded and about a second later, it reloaded
doesnt do it on my desktop tho
laptop i mean
Jan Shah
@JanShah
Sep 18 2017 19:11
I'd try a couple of things. first, get your depencies from cdn sources, they seem to be taking a long time to load. second, get rid of the animation script, jquery one, see if it loads faster without that.
Pagnito
@Pagnito
Sep 18 2017 19:13
doesnt it take longer to load from cdn then directly?
Jan Shah
@JanShah
Sep 18 2017 19:14

https://stackoverflow.com/questions/14863022/settimeout-behaviour-with-blocking-code

'JavaScript is single-threaded. If some block of code uses execution thread, no other code can be executed. This means your setTimeout() call must wait until main execution (the one with busy-waiting while loop) finishes.' - Tomasz Nurkiewicz

@Pagnito cdn is fast fast fast
Pagnito
@Pagnito
Sep 18 2017 19:15
im confused, cuz we are always told its better to download out dependencies?
Jan Shah
@JanShah
Sep 18 2017 19:16
@Pagnito possibly those setTimeout functions you have in your script could be causing problems
@Pagnito nah, cdn is much faster.
Pagnito
@Pagnito
Sep 18 2017 19:18
but isnt a risk, that because its external, it could fck up sometimes
Jan Shah
@JanShah
Sep 18 2017 19:20
go with a reputable cdn and you'll have no issues.
Pagnito
@Pagnito
Sep 18 2017 19:20
yea i just realize i never ended up using tweenmax so there is no need to load it up
piteto
@piteto
Sep 18 2017 19:23
usually, you combine all of your resources into one minified file and load it from your server
otherwise, CDN can be required because some browsers limit you to 3-4 resources downloaded at a time from a single server
Pagnito
@Pagnito
Sep 18 2017 19:27
@piteto r u talkin about webpack?
Henry
@GitHub-Henry
Sep 18 2017 19:30
@Pagnito no, it is a standard practice in many places
Pagnito
@Pagnito
Sep 18 2017 19:38
how do u minify all ur resources into one file?
Richard
@rylew0925
Sep 18 2017 19:42
In the regular expression lessons, I don't get how the "+" sign affects the code
Appending a plus sign (+) after the selector, e.g. /\d+/g, allows this regular expression to match one or more digits.
Isn't that the same function as the "g"?
Richard
@rylew0925
Sep 18 2017 19:50
My main question is, would it make any difference if I was to use the "+" sign?
piteto
@piteto
Sep 18 2017 20:04
@Pagnito No, not webpack, something like minify: https://github.com/mrclay/minify
Pagnito
@Pagnito
Sep 18 2017 20:05
@piteto what about uglify?
piteto
@piteto
Sep 18 2017 20:06
I think it is similar, yes @Pagnito
Pagnito
@Pagnito
Sep 18 2017 20:06
i would need gulp or grunt without using webpack tho?
or can i do it with npm scripts?
piteto
@piteto
Sep 18 2017 20:07
Those will help with automating your deployment - they're also one-time command line tools too
just open up a command prompt and run the tool to combine everything - or yeah, put it in a npm script and have it done automatically every time you deploy
Pagnito
@Pagnito
Sep 18 2017 20:08
@piteto k thanks
CamperBot
@camperbot
Sep 18 2017 20:08
pagnito sends brownie points to @piteto :sparkles: :thumbsup: :sparkles:
:cookie: 118 | @piteto |http://www.freecodecamp.com/piteto
piteto
@piteto
Sep 18 2017 20:10
@rylew0925 /\d/g will select each digit separately. /\d+/g will select all the digits grouped together.
'12345'.match(/\d+/g); //["12345"]
'12345'.match(/\d/g); // ["1", "2", "3", "4", "5"]
one match vs. multiple matches
Mercy Manrique
@mers89
Sep 18 2017 20:13
@gothamknight thanks for going back and trying to solve my issue from friday. :)
CamperBot
@camperbot
Sep 18 2017 20:13
mers89 sends brownie points to @gothamknight :sparkles: :thumbsup: :sparkles:
:cookie: 432 | @gothamknight |http://www.freecodecamp.com/gothamknight
Richard
@rylew0925
Sep 18 2017 21:07
@piteto Thanks
CamperBot
@camperbot
Sep 18 2017 21:07
rylew0925 sends brownie points to @piteto :sparkles: :thumbsup: :sparkles:
api offline
Richard
@rylew0925
Sep 18 2017 22:08
Am I the only one who can't log into FCC?
korzo
@korzo
Sep 18 2017 22:09
@rylew0925 It's down as we speek
mstellaluna
@mstellaluna
Sep 18 2017 22:25
@rylew0925 FCC is currently down and has been reported