These are chat archives for FreeCodeCamp/HelpFrontEnd

20th
Feb 2018
Edson J Vargas
@edsonv
Feb 20 2018 00:26
Hello, I have finished my tribute page but i can not validate my progress on FCC. I mean validate by (ctrl+enter) shortcut, even clicking on the link is not working. Anyone here knows why is this happening or how can I solve it? thank you all
I think it is importat to say that I have inspected the page with chrome inspector and it seem that the validation link does not have a target (href="" attribute)
Eric Weiss
@eweiss17
Feb 20 2018 01:12
I don't believe they actually confirm your projects until you are actually getting the front end certificate if that helps at all
abraham anak agung
@padunk
Feb 20 2018 01:32
@nsonhouse yes
Kanti
@swaroopkkn
Feb 20 2018 02:14
Hello Fellow Campers! can you please check my tribute page and give your feedback/comments? https://codepen.io/swaroopk/pen/aqYogO Thank you!
abraham anak agung
@padunk
Feb 20 2018 02:38
@swaroopkkn Usualy we ask for review in CodeReview room.
  1. Why you give all your style inline?
  2. in codepen, you don't need to write the html tag and body tag.
  3. for the link, it is better to add target="_blank" so others can open it in new tab.
  1. you missed the ; at .thin-purple-border {border-color: purple
Kanti
@swaroopkkn
Feb 20 2018 02:41
Thank you @padunk ! I will delete the message from this room, make the edits and repost in the CodeReview room. Appreciate your response and feedback.
CamperBot
@camperbot
Feb 20 2018 02:41
swaroopkkn sends brownie points to @padunk :sparkles: :thumbsup: :sparkles:
:cookie: 449 | @padunk |http://www.freecodecamp.org/padunk
abraham anak agung
@padunk
Feb 20 2018 02:42
@swaroopkkn that's ok. Last thing, add class="img-fluid" in your image to make it more responsive. Happy coding :smile:
Edson J Vargas
@edsonv
Feb 20 2018 02:50
@eweiss17 I tried with another web explorer and it works. Is a mistery for me
@eweiss17 but thanks for your answer and your concern
CamperBot
@camperbot
Feb 20 2018 02:51
edsonv sends brownie points to @eweiss17 :sparkles: :thumbsup: :sparkles:
:cookie: 611 | @eweiss17 |http://www.freecodecamp.org/eweiss17
Edson J Vargas
@edsonv
Feb 20 2018 02:51
@eweiss17 are you an active dev?
Heathercoraje
@Heathercoraje
Feb 20 2018 03:32
Yo friends, I am doing tictactoc project. I wrote codes for the game itself, but one user playing both sides. I am lost what to do to make the computer play the game with the user.
Kanti
@swaroopkkn
Feb 20 2018 03:32
@padunk Thank you!
CamperBot
@camperbot
Feb 20 2018 03:32
swaroopkkn sends brownie points to @padunk :sparkles: :thumbsup: :sparkles:
api offline
Kanti
@swaroopkkn
Feb 20 2018 03:33
@Heathercoraje Hello!
Heathercoraje
@Heathercoraje
Feb 20 2018 03:33
@swaroopkkn Hello.
:)
Chit Thae Naing
@chitthaenaing
Feb 20 2018 03:33
hi
abraham anak agung
@padunk
Feb 20 2018 03:34
@Heathercoraje :wave: . Make a simple AI doing random move first ?
Heathercoraje
@Heathercoraje
Feb 20 2018 03:35
@padunk Which I have no idea. uhm.
googling..
Greg Gordon
@greggordoncode_twitter
Feb 20 2018 03:35
So i completed all the course matiriel and got the the portfolio creation project and i cant get past navigation bar and background once i get into responsive design i cant remember anything
abraham anak agung
@padunk
Feb 20 2018 03:36
@chitthaenaing Hi.
Chit Thae Naing
@chitthaenaing
Feb 20 2018 03:38
Nice to meet u
Ken Haduch
@khaduch
Feb 20 2018 03:39
@Heathercoraje - a simple idea would be to have an array of the free locations, and just do a random number selection of one of the array indices, then have the computer move to that space.
Heathercoraje
@Heathercoraje
Feb 20 2018 03:40
@khaduch Here, computer move to the random empty space would be just a function?
Ken Haduch
@khaduch
Feb 20 2018 03:41
@Heathercoraje - sure, have a function computerMove() that would do the simple random selection. Later on, computerMove() could be more advanced ...
Heathercoraje
@Heathercoraje
Feb 20 2018 03:43
Make sense.. I thought I would have to build from the scratch again..
Heathercoraje
@Heathercoraje
Feb 20 2018 04:01
@khaduch I actually wrote it on react so this is a new challenge on react. haha
abraham anak agung
@padunk
Feb 20 2018 04:07
@Heathercoraje i wrote it on react too. Good luck :smile:
Claudio Restifo
@Marmiz
Feb 20 2018 04:10
It's actually easier since you leverage the usage of classes, which is how videogames are made as of today in C#/Cpp :)
I made my Simon back then using classes (but no react)
abraham anak agung
@padunk
Feb 20 2018 04:15
I should finish my Simon project then...
Matt Reynolds
@reynoldsmcr_twitter
Feb 20 2018 04:39
It looks like the background is wrapping around to the bottom of my canvas when in full screen mode. I want this area along the bottom to be black. Anyone got a minute to help me out?
https://codepen.io/mreynolds/full/zBrNvp
Claudio Restifo
@Marmiz
Feb 20 2018 04:54
@reynoldsmcr_twitter I don't understand what area you are talking about.
Matt Reynolds
@reynoldsmcr_twitter
Feb 20 2018 04:55
Nevermind, I just figured it out.
My Twitter share button is working, but my Facebook share button isn't. It opens a new tab, but just displays "https://s.codepen.io/boomerang/iFrameKey...", instead of the current quote and author. Has anyone else figured out how to share this on Facebook?
https://codepen.io/mreynolds/full/zBrNvp/
This is the code I'm trying to debug:
$("#facebook-share").attr(
          "href", "https://www.facebook.com/sharer/sharer.php?u=" + encodeURIComponent('"' + currentQuote + '" ' + currentAuthor)
Claudio Restifo
@Marmiz
Feb 20 2018 05:04
@reynoldsmcr_twitter I think facebook uses og meta tags (or something along that line)
Have you looked into FB documentation?
there's like a data-href property
Heathercoraje
@Heathercoraje
Feb 20 2018 05:22
@Marmiz Sorry I missed your comment!
Is it thanks for setting states and stuff?
Tai Jones
@taiJones00
Feb 20 2018 06:56
Hi. Is anyone familiar with bootstrap 4?
Chris
@capozzic1
Feb 20 2018 07:13
Hello, has anyone done the information assurance section on beta fcc? Did you use glitch or clone the starter project?
Deepak Manjunath
@Deepak2322
Feb 20 2018 08:48
hwo to get start date and end date of a year ?
how*
Marianissimus
@Marianissimus
Feb 20 2018 08:50
in javascript? or? what do you mean? jan 1 / dec 31?
Randy
@RandyGoldsmith
Feb 20 2018 09:03
anyone know how to line up the progress bars so they center horizontally?
https://codepen.io/duel_drawer8/pen/zRwraZ?editors=1100
Marianissimus
@Marianissimus
Feb 20 2018 09:06
@RandyGoldsmith u mean vertically? they appear centered horizontally in their parents. You talking about Indesign CC, Illustrator CC and so on?
Randy
@RandyGoldsmith
Feb 20 2018 09:06
@Marianissimus yes sorry..
Tai Jones
@taiJones00
Feb 20 2018 09:06
Could someone help me with a bug?
https://codepen.io/taiJones00/pen/oeeJGa There's this weird offline card that keeps showing up with no name in the allUsers section
Adetayo Timilehin
@Sprimage
Feb 20 2018 09:07
js is driving me crazy
how does JSON.parse() work?
its supposed to parse a string as a JSON object
Aditya
@ezioda004
Feb 20 2018 09:07
@Sprimage It converts JSON to an object.
Adetayo Timilehin
@Sprimage
Feb 20 2018 09:08
but when i run
var values = JSON.parse('a')
it returns SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data
[Learn More]
@ezioda004 ^^

from mdn

The JSON.parse() method parses a JSON string, constructing the JavaScript value or object described by the string. An optional reviver function can be provided to perform a transformation on the resulting object before it is returned.

Marianissimus
@Marianissimus
Feb 20 2018 09:09

@RandyGoldsmith You actually don't need display: flex on the parents of those progress bars. Try to replace .first-bar with this:

.first-bar {
  border: 1px solid black;
  line-height: 30px;
  height: 30px;
}

The idea is to use a height equal to line-height, and everything will center vertically inside it

Adetayo Timilehin
@Sprimage
Feb 20 2018 09:10
@ezioda004 you dont know how it works
Aditya
@ezioda004
Feb 20 2018 09:11
@Sprimage You'd have to do it something like var values = JSON.parse('"a"')
Adetayo Timilehin
@Sprimage
Feb 20 2018 09:12
@ezioda004 thanks, I didn't catch that in the docs
CamperBot
@camperbot
Feb 20 2018 09:12
sprimage sends brownie points to @ezioda004 :sparkles: :thumbsup: :sparkles:
:cookie: 468 | @ezioda004 |http://www.freecodecamp.org/ezioda004
Randy
@RandyGoldsmith
Feb 20 2018 09:13
@Marianissimus still doesnt look centered
Marianissimus
@Marianissimus
Feb 20 2018 09:16
@RandyGoldsmith vertically? it should be. you forgot to delete a "}" on line 94
if the other elements inside the parent element have different sizes / margins / paddings, they will not be aligned
Randy
@RandyGoldsmith
Feb 20 2018 09:17
@Marianissimus wow, that did work..thanks
CamperBot
@camperbot
Feb 20 2018 09:17
randygoldsmith sends brownie points to @marianissimus :sparkles: :thumbsup: :sparkles:
:cookie: 469 | @marianissimus |http://www.freecodecamp.org/marianissimus
Adetayo Timilehin
@Sprimage
Feb 20 2018 09:18
@ezioda004 how can i parse a string in a variable?
Randy
@RandyGoldsmith
Feb 20 2018 09:19
@Marianissimus im just trying to clone a resume page..its super hard...my css and html skills suck so trying to challenge myself..been at it for 3 days
Adetayo Timilehin
@Sprimage
Feb 20 2018 09:19
something like var i = "A"
JSON.parse(i) doesnt work
Aditya
@ezioda004
Feb 20 2018 09:37
My bad, it'd be like this var i = '"A"' and JSON.parse(i)
Randy
@RandyGoldsmith
Feb 20 2018 09:42
@Marianissimus do you know why they wouldnt center vertically when i am devleoping locally but it does on codepen with the same exact code?
NikolaNbgd
@NikolaNbgd
Feb 20 2018 09:44
Hi guys, does anybody know how can I contact FreeCodeCamp API support? Because I got 'Access-Control-Allow-Origin' error, they need to give me access to the server. Thanks in advice! :)
Dany Din
@danydin
Feb 20 2018 09:49
hey can someone help me figure how this blog manipulate the css?
it all has the same elements-classes-ids but the elements show different sizes on the site
Markus Kiili
@Masd925
Feb 20 2018 09:53
@danydin You can use browser developer tools to see what styles are in effect on elements and where the styles come from.
@Masd925 i tried ^
Randy
@RandyGoldsmith
Feb 20 2018 09:53
@Masd925 is there a diff between codepen and developing locally? same code but looks way different on page
Dany Din
@danydin
Feb 20 2018 09:53
check the posts they are in different shapes and i went through every element and it's all the sames.. i even try change the pics but nothing
@RandyGoldsmith make sure you href= the right js,css files
Randy
@RandyGoldsmith
Feb 20 2018 09:56
@danydin i did everything is fine..its just in my codepen.. my progress bars line up vertically perfectly whereas locally they dont
Dany Din
@danydin
Feb 20 2018 09:56
try change codepen size
@Masd925 :o any idea?
Puneeth N
@puneethnviraat
Feb 20 2018 10:48
hi all, i'm new to coding,, is it possible to store the freecodecamp projects code directly to the github...? soo that i can see share github..
Stephen James
@sjames1958gm
Feb 20 2018 11:35
@puneethnviraat Sure you can use github to store your projects. If you do them locally, then you can sync with github for sure.
If you are on something like codepen, there isn't a direct path from codepen to github
Puneeth N
@puneethnviraat
Feb 20 2018 12:19
ok tq @sjames1958gm
CamperBot
@camperbot
Feb 20 2018 12:19
puneethnviraat sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 8997 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
Gustavo Santana
@santanaG
Feb 20 2018 13:12
Does someone have eslint with airbnb styleguide installed globally? I dont know where the .eslintrc file goes if its a global install…or if it even needs it. I am getting mixed results on google….
Got it, it seems that eslint searches up the directory tree so if you set up a .eslintrc file within your home folder it works out as your global config file
Michael Cordero
@CyberPutty
Feb 20 2018 13:17
hey all, I'm trying to do the single page scrolling portfolio and I'm having difficulty getting the anchor tags to offset my fixed navigation bar.
anyone know the best way to handle the offset.
Tom
@moT01
Feb 20 2018 13:19
what exactly do you mean by that @CyberPutty ? what do you want to happen
Michael Cordero
@CyberPutty
Feb 20 2018 13:21
my navbar is fixed to the top of the page so if i click on portfolio for instance when it goes to that href then the first part of my text is covered up due to the overlap from the fixed nav.
@moT01
<a href="#about" class=""><li>about</li></a> 
<div id="about" class="offset">
<style>
.offset::before { 
    display: block; 
     content: " "; 
      height: 150px;      /* Give height of your fixed element */
        margin-top: -150px; /* Give negative margin of your fixed element */      
        visibility: hidden; 
}
</style>
@moT01 i tried this but it doesn't work
Tom
@moT01
Feb 20 2018 13:21
add some margin?
Michael Cordero
@CyberPutty
Feb 20 2018 13:23
i don't want it to affect the actual size of the page due to the spacing, i just need it to backtrack a little or something.
Tom
@moT01
Feb 20 2018 13:23
i dont suppose you have it on codepen?
i fixed something like that with javascript
wanna try that?
Michael Cordero
@CyberPutty
Feb 20 2018 13:23
I'm working on it on git
Tom
@moT01
Feb 20 2018 13:25
could put an empty element somewhere in the previous section with the correct id
Dany Din
@danydin
Feb 20 2018 13:34
anyone expericned with jekyll?
Michael Cordero
@CyberPutty
Feb 20 2018 13:45
@moT01 that's what i ended up doing . I was trying to get it done with the psuedo element but I can't seem to get it to push down on my page. probably due to fixed heights or maybe flexbox who knows. thanks!
CamperBot
@camperbot
Feb 20 2018 13:45
cyberputty sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:star2: 1011 | @mot01 |http://www.freecodecamp.org/mot01
LydaTech
@lydatech
Feb 20 2018 13:48
@CyberPutty put padding on the body or use offset
LydaTech
@lydatech
Feb 20 2018 14:07
Onome Sotu
@onomesotu
Feb 20 2018 14:33
Does any one know if sumPrimes() problem is bugged?
i have this solution, it works fine in the console and on repl.it but it shows error on freecode camp tests
function sumPrimes(num) {
  var sum = 2;

  for(var i = 3; i <= num; ++i){
    if(isPrime(i)){
      sum += i;
    }
  }

  function isPrime(int){
    var foundPrime = true;
    for(var i = 2; i < int; ++i){
      if(int % i === 0) {
        foundPrime = false;
      }
    }
    return foundPrime;
  }

  return sum;
}

sumPrimes(977);
Koderkid1936
@Koderkid1936
Feb 20 2018 14:35

Does this mean that the efficiency of the algorithm will depend on the size and the time it takes to execute? am I understanding this sentence? Can someone confirm. Btw the context here is the 'Efficiency of Algos'

"In general, both time and space requirements depend on the algorithm’s input (typically the “size” of the input)."

Onome Sotu
@onomesotu
Feb 20 2018 14:36
@Koderkid1936 The longer the input(size) of the algorithm.. the more time it takes and more space(memory) i suppose?
Koderkid1936
@Koderkid1936
Feb 20 2018 14:37
@onomesotu exactly what I was thinking, just making sure, since english isn't my first Language
thanks btw
@onomesotu ty
CamperBot
@camperbot
Feb 20 2018 14:38
koderkid1936 sends brownie points to @onomesotu :sparkles: :thumbsup: :sparkles:
:cookie: 310 | @onomesotu |http://www.freecodecamp.org/onomesotu
abraham anak agung
@padunk
Feb 20 2018 14:40
@onomesotu try to restart it. your code work fine
Onome Sotu
@onomesotu
Feb 20 2018 14:44
@padunk I have done it, still the same :worried:
Stephen James
@sjames1958gm
Feb 20 2018 14:45
@onomesotu Look for inefficiencies, like once you have found that a value is not prime, do you need to keep checking?
Do you need to check every number from 2 to int? can you stop sooner, perhaps Math.sqrt(int)
Onome Sotu
@onomesotu
Feb 20 2018 14:55
@sjames1958gm Yes, I had that in mind, i was going to optimize later, like skipping all even numbers and checking up the squareroot of num, but this is a correct solution and it doesn't even pass..
Onome Sotu
@onomesotu
Feb 20 2018 15:06
@sjames1958gm This is a more efficient solution right?
function sumPrimes(num) {
  var sum = 2;

  for(var i = 3; i <= num; i+=2){
    if(isPrime(i)){
      sum += i;
    }
  }

  function isPrime(int){
    var foundPrime = true;
    for(var i = 2; i <= Math.sqrt(int); ++i){
      if(int % i === 0) {
        foundPrime = false;
      }
    }
    return foundPrime;
  }

  return sum;
}
Stephen James
@sjames1958gm
Feb 20 2018 15:07
@onomesotu Summing odd primes? Doesn't work for any numbers?
Onome Sotu
@onomesotu
Feb 20 2018 15:08
And it now works btw, I had to disable infinite loop protection on FCC
Stephen James
@sjames1958gm
Feb 20 2018 15:08
@onomesotu for(var i = 2; i <= Math.sqrt(int) && foundPrime; ++i){ this would stop the loop when you first fail
Onome Sotu
@onomesotu
Feb 20 2018 15:08
@sjames1958gm, i'm only checking odd numbers with the first for loop
Stephen James
@sjames1958gm
Feb 20 2018 15:08
@onomesotu I understand now.
Onome Sotu
@onomesotu
Feb 20 2018 15:10
@onomesotu for(var i = 2; i <= Math.sqrt(int) && foundPrime; ++i){ this would stop the loop when you first fail
I don't understand, can you plese explain?
@sjames1958gm
Stephen James
@sjames1958gm
Feb 20 2018 15:10
@onomesotu Once you set foundPrime to false i <= Math.sqrt(int) && foundPrime this is also false and the loop stops

Another option is

      if(int % i === 0) {
        foundPrime = false;
        break; // to stop looping once you know the value is not prime
      }

or even

      if(int % i === 0) {
        return false; // function is done the first time you see false
      }
Gabe Pressman
@gpressman
Feb 20 2018 15:13
I know this is the front end channel, but is anyone familiar with react that can lend a hand?
mustimuu
@mustimuu
Feb 20 2018 15:15

Hello guys and girls

i am trying to make my burger-menu bar toggle at max width 768px. The toggle works, but it kinda look wierd

billede.png
Gabe Pressman
@gpressman
Feb 20 2018 15:15
@mustimuu can you link the pen?
mustimuu
@mustimuu
Feb 20 2018 15:16
i use brackets
want me to put it online ?
sec
Onome Sotu
@onomesotu
Feb 20 2018 15:16

Another option is

      if(int % i === 0) {
        foundPrime = false;
        break; // to stop looping once you know the value is not prime
      }

or even

      if(int % i === 0) {
        return false; // function is done the first time you see false
      }

Yes, you're right @sjames1958gm

Gabe Pressman
@gpressman
Feb 20 2018 15:17
don't know if I can help without being able to see code
mustimuu
@mustimuu
Feb 20 2018 15:17
@gpressman sure give me 2 min
Onome Sotu
@onomesotu
Feb 20 2018 15:18
@sjames1958gm thanks
CamperBot
@camperbot
Feb 20 2018 15:18
onomesotu sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 8998 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
Stephen James
@sjames1958gm
Feb 20 2018 15:18
@onomesotu :+1:
@gpressman What's your issue
Gabe Pressman
@gpressman
Feb 20 2018 15:19
I just need fresh eyes I guess, the game runs, and as far as I can tell when I test it's doing what I intend
but it doesn't play out the way others do
components are in no intentional order, I copied and pasted out of my local onto codepen so maybe someone could look.
Stephen James
@sjames1958gm
Feb 20 2018 15:21
Everything is commented out?
mustimuu
@mustimuu
Feb 20 2018 15:21
@gpressman hang on
Gabe Pressman
@gpressman
Feb 20 2018 15:21
sorry, refresh, try now
at 768px
@gpressman you there mate?
Gabe Pressman
@gpressman
Feb 20 2018 15:24
what is the desired effect?
the menu to be centered?
mustimuu
@mustimuu
Feb 20 2018 15:24
vertical
exactly
center vertical
@gpressman
Gabe Pressman
@gpressman
Feb 20 2018 15:26
Ok, the ul has a float right and the lis are inline block, if you take away the float right the whole thing won't be offset, and take away the inline block and they'll stack
mustimuu
@mustimuu
Feb 20 2018 15:26
kk 2 sec
Gabe Pressman
@gpressman
Feb 20 2018 15:27
be patient when someone is trying to help you...
Stephen James
@sjames1958gm
Feb 20 2018 15:27
@gpressman Are you mutating the rows while you are calculating the next round?
mustimuu
@mustimuu
Feb 20 2018 15:27
@gpressman sorry :D too much coffe
@gpressman the float right is over 768px
so how does it affect?
the max 768px
Gabe Pressman
@gpressman
Feb 20 2018 15:29
Your viewport stuff may be screwy, looks like it's being applied everywhere
mustimuu
@mustimuu
Feb 20 2018 15:30
oh my, how do i fix it sir?
Gabe Pressman
@gpressman
Feb 20 2018 15:31
looks like you forgot your curly braces
mustimuu
@mustimuu
Feb 20 2018 15:32
Exactly where sir?
im looking
Gabe Pressman
@gpressman
Feb 20 2018 15:32
on the media query itself, I can't actually see code, only what is compiled
give me a minute now to figure out my thing and I'll look more closely if you need it
mustimuu
@mustimuu
Feb 20 2018 15:33
@gpressman thank
CamperBot
@camperbot
Feb 20 2018 15:33
mustimuu sends brownie points to @gpressman :sparkles: :thumbsup: :sparkles:
:cookie: 333 | @gpressman |http://www.freecodecamp.org/gpressman
Gabe Pressman
@gpressman
Feb 20 2018 15:34
@sjames1958gm I don't think so, I just have this block of code saying to keep running over and over
componentDidMount() {
    setInterval(() => {
      let squares = this.state.squares.slice();
      for (var i = 0; i < squares.length; i++) {
        for (var x = 0; x < squares[i].length; x++) {
          squares[i][x] = this.updateSquare(
            squares[i][x],
            this.checkNeighbors(i, x)
          );
        }
      }
      this.setState({
        squares: squares,
        generation: this.state.generation + 1
      });
    }, 1);
  }
@sjames1958gm you think the problem is it's asychronous?
Stephen James
@sjames1958gm
Feb 20 2018 15:35
@gpressman squares[i] is an array that is in both squares and this.state.squares
@gpressman You copy the outer array but not the inner arrays
Anna
@AnnaVih
Feb 20 2018 15:36
Hi guys
I need some help
I have built my weather project with ES6 , webpack and babel
mustimuu
@mustimuu
Feb 20 2018 15:38
@gpressman i tried to fix but same error.
Anna
@AnnaVih
Feb 20 2018 15:38
And now I want to deploy online just html css and js file wich is converted to es5
But it looks like it can’t work just with that
Gabe Pressman
@gpressman
Feb 20 2018 15:41
@sjames1958gm I think I follow what the problem is, but I'm turning myself around trying to fix it
@mustimuu make a codepen and copy the code into there and I'll look when I have a chance, I got a bug at work
Stephen James
@sjames1958gm
Feb 20 2018 15:42
@gpressman
for (var i = 0; i < squares.length; i++) {
        let thisrow = squares[i].slice()
        for (var x = 0; x < thisrow.length; x++) {
           // In here process thisrow
        }
        squares[i] = thisrow;
}
h1tag
@h1tag
Feb 20 2018 15:42
@AnnaVih I'm only familiar with ES6, but I can try to help
can you post the code if it's hosted somewhere, like codepen
Anna
@AnnaVih
Feb 20 2018 15:43
Cool
It still locally
h1tag
@h1tag
Feb 20 2018 15:44
can you host it somewhere?
Anna
@AnnaVih
Feb 20 2018 15:44
As i can not putt all files on code pen
Github
I did push there
Sorry just add https://
Before that
h1tag
@h1tag
Feb 20 2018 15:46
what's not working?
Anna
@AnnaVih
Feb 20 2018 15:47
Everything is working cool when I npm start
With ES6 files
It is compile into bundlle.js
But my question is
How can I host in production just html css and bunndle js
Without all other files
Or I have to put them all?
h1tag
@h1tag
Feb 20 2018 15:49
Oh, that I don't know about
Anna
@AnnaVih
Feb 20 2018 15:49
Ok! No problem
Thanks)
Gabe Pressman
@gpressman
Feb 20 2018 15:49
@sjames1958gm Ok, thanks. hopefully I got it from here. Gotto fix a ticket at work then hopefully I can figure this out
CamperBot
@camperbot
Feb 20 2018 15:49
gpressman sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 8999 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
Stephen James
@sjames1958gm
Feb 20 2018 15:49
@AnnaVih You should be able to just deploy those files that are loaded by the browser.
If you load your page, look at the network tab in devtools and only those files are needed
h1tag
@h1tag
Feb 20 2018 15:50
you're welcome @AnnaVih
Dany Din
@danydin
Feb 20 2018 15:51
@danydin
hey can someone help me figure how this blog POSTS design are manipulated?
it all has the same elements-classes-ids but the elements show different sizes on the site
https://jekyller.github.io/jasper2/
on mouse down event, background color of button becomes transparent
can anyone help me with that ?
new quote button
mustimuu
@mustimuu
Feb 20 2018 15:55
guys
Can someone help me out im still stuck.
Tom
@moT01
Feb 20 2018 15:58
whats the problem
mustimuu
@mustimuu
Feb 20 2018 15:58
@moT01 sir
@moT01 i want my burger-menu display at max width 768px
It has a property of display none over that
but it wont display
Tom
@moT01
Feb 20 2018 15:59
k
heres the site
Tom
@moT01
Feb 20 2018 16:01
what element is the hamburger
.toggle?
mustimuu
@mustimuu
Feb 20 2018 16:01
 <i class="fa fa-bars menu" aria-hidden="true"></i>
yes
exactly
Tom
@moT01
Feb 20 2018 16:04
are the other media queries working
?
mustimuu
@mustimuu
Feb 20 2018 16:04
I have two
yes it is
does
Tom
@moT01
Feb 20 2018 16:05
are they working - do the properties get changed when you shrink the window?
mustimuu
@mustimuu
Feb 20 2018 16:05
well
sec
SOmething is wrong
Tom
@moT01
Feb 20 2018 16:07
well, when i remove the display: none in the dev tools it shows
h1tag
@h1tag
Feb 20 2018 16:07
@yb1997 I think it has to do with the linear-gradient color
Tom
@moT01
Feb 20 2018 16:07
not sure why it's not getting applied
mustimuu
@mustimuu
Feb 20 2018 16:07
hmm
Tom
@moT01
Feb 20 2018 16:08
thought maybe a syntax error... you could try putting !important after it in the media query to see if something else is overriding that property
h1tag
@h1tag
Feb 20 2018 16:08
@yb1997 because if you change it to, for example: black, it stops becoming transparent
Tom
@moT01
Feb 20 2018 16:09
try removing screen in the css
Ken Haduch
@khaduch
Feb 20 2018 16:09
@mustimuu - try to change it to @media screen and (max-width: 768px) { - I think that you need the and in there?
mustimuu
@mustimuu
Feb 20 2018 16:09
ahhhhhh
the screen made the issue
@moT01 thank
CamperBot
@camperbot
Feb 20 2018 16:09
mustimuu sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:star2: 1013 | @mot01 |http://www.freecodecamp.org/mot01
mustimuu
@mustimuu
Feb 20 2018 16:10
i have another question though
which was my primary question
at 768px i want the menu when you click on the toggle to be vertical.
Tom
@moT01
Feb 20 2018 16:10
@khaduch i think that would work too
Ken Haduch
@khaduch
Feb 20 2018 16:10
@mustimuu - it also appears to work if you put the and in there, and leave the screen...
mustimuu
@mustimuu
Feb 20 2018 16:10
when you click it now its not vertical
Tom
@moT01
Feb 20 2018 16:11
save it to your site so we can see
mustimuu
@mustimuu
Feb 20 2018 16:11
Second
saving it
here you go
Sandro Das Neves
@sandro-git
Feb 20 2018 16:13
hello, i'm currently workin on portfolio project
can someone give me some help please ?
Yogender
@yb1997
Feb 20 2018 16:13
@h1tag but i do want to use linear-gradient
Tom
@moT01
Feb 20 2018 16:14
@mustimuu make them block
Jim Ventura
@newbygolfer_twitter
Feb 20 2018 16:14
Why do I need to specify <tr> under <thead> when the "<th>'s" load regardless?
Abhishek Katiyar
@abhishekkatiyar
Feb 20 2018 16:14
Does using code from FreeCodeCamp forums for Intermediate Algorithm Challenges violates the academic honesty policy ? Please Help
I'm facing problems in solving Intermediate Challenges
mustimuu
@mustimuu
Feb 20 2018 16:14
@moT01 they are block
Ken Haduch
@khaduch
Feb 20 2018 16:14
@moT01 - you are still applying a style display: inline-block; around line 47 of your style.css
Tom
@moT01
Feb 20 2018 16:14
open the dev tools - find the <li> and check the properties
mustimuu
@mustimuu
Feb 20 2018 16:15

´´´
.toggle {
display: block;
}
ul {
width: 100%;
display: none;
background-color: indianred;
}
ul li {
display: block;
text-align: center;
}
.active {
display: block;
}

´´´´

Ken Haduch
@khaduch
Feb 20 2018 16:15

@mustimuu - I think that the specificity of this:

nav ul li {
    list-style-type: none;
    display: inline-block;
    transition: 0.8s all;
}

is overriding your other class. Copy that into the media query section, and change the inline-block to block and then it should work...

that's the one around line 47
Yogender
@yb1997
Feb 20 2018 16:15
@abhishekkatiyar In which challenge are facing problem ?
h1tag
@h1tag
Feb 20 2018 16:17
@yb1997 I am not sure how you would fix this, but you can try the button:active stuff in CSS, forget what they are called, events maybe
Abhishek Katiyar
@abhishekkatiyar
Feb 20 2018 16:18
@yb1997 Challenge Steamroller
Ken Haduch
@khaduch
Feb 20 2018 16:18
@abhishekkatiyar - you should paste your code here and specific questions to try and get help...
Darren
@DarrenfJ
Feb 20 2018 16:18
hey @codernewby, sent you some links
Yogender
@yb1997
Feb 20 2018 16:18
@h1tag tried already but that didn't fixed it
h1tag
@h1tag
Feb 20 2018 16:18
:/
Abhishek Katiyar
@abhishekkatiyar
Feb 20 2018 16:19
h1tag
@h1tag
Feb 20 2018 16:19
@sandro-git what's your question?
mustimuu
@mustimuu
Feb 20 2018 16:20
guys
i want my ul to be centeret as the rest of the nav when you activate it
Sandro Das Neves
@sandro-git
Feb 20 2018 16:20
i'm working on portfolio and i'm not really inspire about what to write about me and images to put on it and the desgin too
mustimuu
@mustimuu
Feb 20 2018 16:20
but it doesent work, any suggestions?
Darren
@DarrenfJ
Feb 20 2018 16:20
@coderNewby, they're in PM
coderNewby
@coderNewby
Feb 20 2018 16:21
thanks @DarrenfJ
CamperBot
@camperbot
Feb 20 2018 16:21
codernewby sends brownie points to @darrenfj :sparkles: :thumbsup: :sparkles:
:star2: 2397 | @darrenfj |http://www.freecodecamp.org/darrenfj
h1tag
@h1tag
Feb 20 2018 16:21
@sandro-git you don't have to write anything special for this project, just use some placeholder text
Ken Haduch
@khaduch
Feb 20 2018 16:21
@mustimuu - it looks like it is centered to me, at least in my working / devtools modified environment
h1tag
@h1tag
Feb 20 2018 16:21
and images
Sandro Das Neves
@sandro-git
Feb 20 2018 16:22
ok some lorem ipsum his fine tough ?
h1tag
@h1tag
Feb 20 2018 16:22
yea
mustimuu
@mustimuu
Feb 20 2018 16:22
@khaduch when you see the pink coloured UL
background
Sandro Das Neves
@sandro-git
Feb 20 2018 16:22
placeholder image too ?
mustimuu
@mustimuu
Feb 20 2018 16:22
want that to be centeret
h1tag
@h1tag
Feb 20 2018 16:22
@sandro-git yes
Ken Haduch
@khaduch
Feb 20 2018 16:22
@mustimuu - oh, I see...
mustimuu
@mustimuu
Feb 20 2018 16:22
billede.png
Sandro Das Neves
@sandro-git
Feb 20 2018 16:22
thank you @h1tag
CamperBot
@camperbot
Feb 20 2018 16:22
sandro-git sends brownie points to @h1tag :sparkles: :thumbsup: :sparkles:
:cookie: 919 | @h1tag |http://www.freecodecamp.org/h1tag
h1tag
@h1tag
Feb 20 2018 16:22
and for the design, try to design it on a paper first @sandro-git
then translate it to html and css
Sandro Das Neves
@sandro-git
Feb 20 2018 16:23
can i send you what i was doing to have some feedback ?
Yogender
@yb1997
Feb 20 2018 16:23
@abhishekkatiyar all you have to do is keep extracting the elements of array until you find either null or a primitive value
h1tag
@h1tag
Feb 20 2018 16:24
@sandro-git sure
Ken Haduch
@khaduch
Feb 20 2018 16:24
@mustimuu - you have a margin:right: 30px around line 59 in your style.css for selector nav ul - if you get rid of that it centers it
Yogender
@yb1997
Feb 20 2018 16:24
*array
mustimuu
@mustimuu
Feb 20 2018 16:24
Thank you !
@khaduch thank
CamperBot
@camperbot
Feb 20 2018 16:24
mustimuu sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 3743 | @khaduch |http://www.freecodecamp.org/khaduch
the blue color is only for spacing
Abhishek Katiyar
@abhishekkatiyar
Feb 20 2018 16:25
@yb1997 thanks
CamperBot
@camperbot
Feb 20 2018 16:25
abhishekkatiyar sends brownie points to @yb1997 :sparkles: :thumbsup: :sparkles:
:cookie: 177 | @yb1997 |http://www.freecodecamp.org/yb1997
Yogender
@yb1997
Feb 20 2018 16:25
no problem
Geshtu
@Geshtu
Feb 20 2018 16:27
Hi all, just finished the barebones for Quote Machine, I was hoping someone might be able to spare a set of eyes to take a look! https://codepen.io/Geshtu/pen/vdRzZQ
h1tag
@h1tag
Feb 20 2018 16:27
@sandro-git so you're going to change that blue color?
mustimuu
@mustimuu
Feb 20 2018 16:28
@khaduch one last thing
i want the ul background to stick to the nav header
Sandro Das Neves
@sandro-git
Feb 20 2018 16:28
@h1tag yes it's only to see the spacing around the div
mustimuu
@mustimuu
Feb 20 2018 16:28
so it looks smoothly
Matej Bošnjak
@mbosnjak01
Feb 20 2018 16:29
@Geshtu looks good. what I would do here is to make your app wrapped with height that won't change if you have, for example, a quote that goes in 3-4 rows ... maybe just make height a little bit higher than it currently is ... also I would add some jquery transition animation, like fade out old quote then fade in new quote (but that's just for show, not needed in this challenge) ... and of yourse twitter button to work :P
h1tag
@h1tag
Feb 20 2018 16:30
@sandro-git the navbar and the footer looks goods, I would add titles to the sections (about, portfolio ...) and add more spaces between these sections
Ken Haduch
@khaduch
Feb 20 2018 16:30
@mustimuu - there is a 30px margin around line 59 that puts some top margin on the list. There is still some spacing, perhaps from navbar?
h1tag
@h1tag
Feb 20 2018 16:31
@sandro-git plus, not all the links on the navbar directs me to the correct section of the page, so you need to fix that
Sandro Das Neves
@sandro-git
Feb 20 2018 16:31
@h1tag thank you i'm gonna do that it's a work in progress. i can let the placeholders like that ?
CamperBot
@camperbot
Feb 20 2018 16:31
sandro-git sends brownie points to @h1tag :sparkles: :thumbsup: :sparkles:
api offline
Geshtu
@Geshtu
Feb 20 2018 16:31
@mbosnjak01 Strange, the button was working for me but I imagine a target blank will do the trick for embedding on codepen. Thanks for the feedback!
CamperBot
@camperbot
Feb 20 2018 16:31
geshtu sends brownie points to @mbosnjak01 :sparkles: :thumbsup: :sparkles:
:cookie: 236 | @mbosnjak01 |http://www.freecodecamp.org/mbosnjak01
Matej Bošnjak
@mbosnjak01
Feb 20 2018 16:33
@Geshtu yep. that did the trick :)
h1tag
@h1tag
Feb 20 2018 16:33
@sandro-git yea, you can
Sandro Das Neves
@sandro-git
Feb 20 2018 16:34
@h1tag ok thank you very much let's go back to work ;-)
CamperBot
@camperbot
Feb 20 2018 16:34
sandro-git sends brownie points to @h1tag :sparkles: :thumbsup: :sparkles:
api offline
Matej Bošnjak
@mbosnjak01
Feb 20 2018 16:34
@Geshtu when working with your own data objects, I'd put them in separate file and then call them via jquery ajax
h1tag
@h1tag
Feb 20 2018 16:34
:+1:
Matej Bošnjak
@mbosnjak01
Feb 20 2018 16:34
you can host it somewhere and try it
mustimuu
@mustimuu
Feb 20 2018 16:35
@khaduch i allready removed that it worked
heres the updated version
its the li on 768px
Ken Haduch
@khaduch
Feb 20 2018 16:37

@mustimuu - and some -webkit-margin-before: in the main stylesheet for the page. If you add -webkit-margin-before: 0px; in the style that gets applied to that ul element, then it closes the gap.

But is everything working now?

mustimuu
@mustimuu
Feb 20 2018 16:37
main stylesheet ?
you mean with the unversal selector?
Ken Haduch
@khaduch
Feb 20 2018 16:39
@mustimuu - yes, in the devtools they call it "user agent stylesheet" - I think that it is the browser defaults, although I don't understand if there really is a stylesheet, but there must be.
mustimuu
@mustimuu
Feb 20 2018 16:39
any tutorials on that?
Ken Haduch
@khaduch
Feb 20 2018 16:41
@mustimuu - just searching - https://meiert.com/en/blog/user-agent-style-sheets/ - it is the browser default styles. That is why they recommend doing a reset or "normalize" to start with your own set of defaults and then work from there. I guess that the point is that there are defaults and sometimes you want to override them...
mustimuu
@mustimuu
Feb 20 2018 16:44
@khaduch thank it worked
CamperBot
@camperbot
Feb 20 2018 16:44
mustimuu sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
api offline
mustimuu
@mustimuu
Feb 20 2018 16:46
@khaduch how do i make the nav ul stick to the nav?
so it looks cool. by using margin?
seems like too simple and a bad practise
Geshtu
@Geshtu
Feb 20 2018 16:56
@mbosnjak01 that's a good idea, the separate file. I was already thinking about a toggle button to switch between my quotes (array) to a website's quotes (api), so potential viewers can see the differences. Adding a 3rd toggle at that point wouldn't take much more work!
Ken Haduch
@khaduch
Feb 20 2018 17:03
@mustimuu - well, the thing is that if a margin is being placed on an element that it is moving other elements away, then you have to find a way to make that margin disappear, or override it in some way. That article that I posted hinted at resets as being bad - I didn't look into it yet to see what the point was there. I have seen so many people recommend using them that I'm curious (it is an older article, so maybe the opinions have changed?) But you can target those specific elements and take away the margins and/or padding where they are interfering with your objectives.
LydaTech
@lydatech
Feb 20 2018 17:08
@mustimuu add this
nav{
  position: fixed;
  width: 100vw;
  background-color: #242582;
}
mustimuu
@mustimuu
Feb 20 2018 17:09
sec
@lydatech i dont think you understand
think im explaining it poorly
LydaTech
@lydatech
Feb 20 2018 17:12
@mustimuu I must have misread what you wanted
Michael Cordero
@CyberPutty
Feb 20 2018 17:24
@mustimuu are you looking for position:sticky; ?
mustimuu
@mustimuu
Feb 20 2018 17:32
guys
i want my ul to stick to the toggle
how do i do that?
www.beproductive.dk/treehousecss/index.html. it is at 768px
mustimuu
@mustimuu
Feb 20 2018 17:38
guys
Alex
@Wulfheart
Feb 20 2018 17:38
@mustimuu Wait a minute
Do you have a codepen or jsfiddle?
Michael Cordero
@CyberPutty
Feb 20 2018 17:40
they are already grouped together with your class toggle by the nav element. I'm not sure i understand if you want it to stick to the top of the screen you can use position fixed.
mustimuu
@mustimuu
Feb 20 2018 17:40
i use brackets
the ul
i want to stick to the toggle
so the blue in the middle is gone
i fixed it
had some margin
on
Michael Cordero
@CyberPutty
Feb 20 2018 17:43
@mustimuu ya if you need to adjust the blue you have to change the padding margin or height of the header and child element.
rahul
@Rahul78275_twitter
Feb 20 2018 18:33
I am new to this site. Can you guys please help me out in a code.
Stephen James
@sjames1958gm
Feb 20 2018 18:33
@Rahul78275_twitter What's the issue?
This is a demo link. I want to animate each my featured projects in a single section when user press arrow down button. (keydown event) without moving to next section. Once all the project have been animated, user can move to next section
rahul
@Rahul78275_twitter
Feb 20 2018 18:39
@sjames1958gm Is there any solution ? I have used particle.js framework in this page.
Stephen James
@sjames1958gm
Feb 20 2018 18:41
@Rahul78275_twitter Have you tried listening for keydown? and it didn't work?
Manan Shah
@mananshah51
Feb 20 2018 18:43
Hello Guys,
Stephen James
@sjames1958gm
Feb 20 2018 18:43
@mananshah51 hi
rahul
@Rahul78275_twitter
Feb 20 2018 18:44

yes ! it works well. if(index == 6 && direction == 'down'){

$('#section7').addClass(' bg-primary ');
$('#section6').addClass('rollIn animated');

}

Manan Shah
@mananshah51
Feb 20 2018 18:44

```<!DOCTYPE html>

<html>

<head>
<!-- Adding Bootstrap library -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<!--Adding jQuery Library -->

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script>
$(document).ready(function() {
$("h2").css("background-color", "black");
$("p").css("background-color", "red");
});
</script>

<title>My Tribute Page using Bootstrap</title>

<style>
h2{
min-height: 100vh;
margin-left: 0;
margin-bottom: 0;
margin-top: 0;
margin-right: 0;
}
p{
min-height: 100vh;
margin-left: 0;
margin-bottom: 0;
margin-top: 0;
margin-right: 0;
}
</style>
</head>

<body>
<div class="container-fluid">
<div class="row">
<div class="col-lg-12">
<h2 class="text-center text-primary">Rod Canion <br/> "The Silicon Cowboy"</h2>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<p class="text-center text-primary">Co-founder of Compaq Computer Corp <br/> Founded in 1982 </p>
</div>
</div>
</div>
</body>
</html>
```

Alex
@Wulfheart
Feb 20 2018 18:45
What are you using jquery for??
Manan Shah
@mananshah51
Feb 20 2018 18:45

```<link><!DOCTYPE html>

<html>

<head>
<!-- Adding Bootstrap library -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<!--Adding jQuery Library -->

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script>
$(document).ready(function() {
$("h2").css("background-color", "black");
$("p").css("background-color", "red");
});
</script>

<title>My Tribute Page using Bootstrap</title>

<style>
h2{
min-height: 100vh;
margin-left: 0;
margin-bottom: 0;
margin-top: 0;
margin-right: 0;
}
p{
min-height: 100vh;
margin-left: 0;
margin-bottom: 0;
margin-top: 0;
margin-right: 0;
}
</style>
</head>

<body>
<div class="container-fluid">
<div class="row">
<div class="col-lg-12">
<h2 class="text-center text-primary">Rod Canion <br/> "The Silicon Cowboy"</h2>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<p class="text-center text-primary">Co-founder of Compaq Computer Corp <br/> Founded in 1982 </p>
</div>
</div>
</div>
</body>
</html>
```

Brad
@bradtaniguchi
Feb 20 2018 18:46
@mananshah51 What are you trying to do?
Eric Weiss
@eweiss17
Feb 20 2018 18:46
do shift + enter
rahul
@Rahul78275_twitter
Feb 20 2018 18:46
@mananshah51 Suppose in the red section you have five slides of project and each you have to display on key down event.only then you can move to next section.
Stephen James
@sjames1958gm
Feb 20 2018 18:46
@mananshah51 you can edit your existing post and you need
the ``` on a separate line from the rest
Manan Shah
@mananshah51
Feb 20 2018 18:47
@bradtaniguchi When I use this code, I still get some white margin on the right and the left side even when i have made margin-left:0; in my CSS
Brad
@bradtaniguchi
Feb 20 2018 18:47
@mananshah51 Do you have a codepen so other's can see the issue live?
Stephen James
@sjames1958gm
Feb 20 2018 18:47
@mananshah51 Set your body margin to zero
Alex
@Wulfheart
Feb 20 2018 18:47
@mananshah51 Could you make a codepen or a jsfiddle
Manan Shah
@mananshah51
Feb 20 2018 18:47
@Wulfheart I am just trying to play around with jQuery, to see how it works
Alex
@Wulfheart
Feb 20 2018 18:48
@mananshah51 jQuery is imho outdated
Stephen James
@sjames1958gm
Feb 20 2018 18:48
@mananshah51 this will reset for whole page
*{
    margin:0;
}
Manan Shah
@mananshah51
Feb 20 2018 18:49
@sjames1958gm Let me make my Body Margin 0 .
Brad
@bradtaniguchi
Feb 20 2018 18:50
After inspecting the html, it looks like its the class from bootstrap applying padding
its the col-lg-12class adding 15px left right, inspect the html using your browsers dev tools to see it
Manan Shah
@mananshah51
Feb 20 2018 18:51
@sjames1958gm I tried doing that but does that work out.
@bradtaniguchi I am working on it.
rahul
@Rahul78275_twitter
Feb 20 2018 18:53
@Rahul78275_twitter Have you tried listening for keydown? and it didn't work? $('#section7').addClass(' bg-primary ');
$('#section6').addClass('rollIn animated');
Manan Shah
@mananshah51
Feb 20 2018 18:55
@bradtaniguchi I tried doing this and it fits the full width properlt
properly.
<div class="col-lg-14">
Changed it from
<div class="col-lg-12">
I changed it from 12 to 14 ..It fits the full width now.
Brad
@bradtaniguchi
Feb 20 2018 18:56
Thats odd tho, I thought bootstrap only goes up to 12
Manan Shah
@mananshah51
Feb 20 2018 18:56
@bradtaniguchi Even I looked at it and it only said 12.
Brad
@bradtaniguchi
Feb 20 2018 18:57
Its possible putting 14 adds no CSS tho
cuse its not a real class
If you remove the class does the problem go away as well? (im not looking at the demo anymore
Manan Shah
@mananshah51
Feb 20 2018 18:57
@bradtaniguchi You mean I remove the
<div class="col-lg-12">
Brad
@bradtaniguchi
Feb 20 2018 18:58
Just the class, leave the div
Manan Shah
@mananshah51
Feb 20 2018 18:58
@bradtaniguchi Let me try.
@bradtaniguchi Yes, it works fine when i remove the class
Brad
@bradtaniguchi
Feb 20 2018 19:00
Yea, not that I think back you might of been using the bootstrap css classes without a container
Manan Shah
@mananshah51
Feb 20 2018 19:01
@bradtaniguchi I have used
<div class="container-fluid">
Brad
@bradtaniguchi
Feb 20 2018 19:01
Did you use row?
Yea nvm I finally stopped being lazy and looked haha
Dany Din
@danydin
Feb 20 2018 19:02
hey can someone help me figure how this blog POSTS design are manipulated?
it all has the same elements-classes-ids but the elements show different sizes on the site
https://jekyller.github.io/jasper2/
Stephen James
@sjames1958gm
Feb 20 2018 19:03
@mananshah51 Using the devtools you can see where the whitespace comes from
Brad
@bradtaniguchi
Feb 20 2018 19:03
He found it, now looking at it more it makes sense, the columns add padding between each column so things aren't so bunched up. Its just more obvious in this case as your background for the column is a differen't color(black) than the normal background of the page (white)
Manan Shah
@mananshah51
Feb 20 2018 19:04
@bradtaniguchi Thank you so much. Appreciate your help.
Brad
@bradtaniguchi
Feb 20 2018 19:04
@mananshah51 Np :D
Dany Din
@danydin
Feb 20 2018 19:04

hey can someone help me figure how this blog POSTS design are manipulated?
it all has the same elements-classes-ids but the elements show different sizes on the site
https://jekyller.github.io/jasper2/

@bradtaniguchi @sjames1958gm would appericate if u can give a look ^

Brad
@bradtaniguchi
Feb 20 2018 19:05
@danydin Can you specify exactly what you want to know? Is it how the images are being resized?
Dany Din
@danydin
Feb 20 2018 19:06
the elements of the posts on the main page are desgined differently
and i can't figure what caused it to.. as it's all exactly the same
Brad
@bradtaniguchi
Feb 20 2018 19:06
Your asking how they made each post look different? (they all look the same to me, besides differen't sizes and orientations)
Dany Din
@danydin
Feb 20 2018 19:07
yes this what i talk about
what manipulate the size/orienation?
if it all has the same classes/ids
mustimuu
@mustimuu
Feb 20 2018 19:08
@CyberPutty thank
CamperBot
@camperbot
Feb 20 2018 19:08
mustimuu sends brownie points to @cyberputty :sparkles: :thumbsup: :sparkles:
:cookie: 309 | @cyberputty |http://www.freecodecamp.org/cyberputty
Brad
@bradtaniguchi
Feb 20 2018 19:09
@danydin It looks like its all done with CSS, and prolly some jquery somewhere (they have it on the page)
But the main magic is CSS
Dany Din
@danydin
Feb 20 2018 19:09
what exactly in css if its all the same classes
Brad
@bradtaniguchi
Feb 20 2018 19:09
If you rezise the page, the cards change orientation and size
@danydin Its "smart" css haha
Dany Din
@danydin
Feb 20 2018 19:10
where can i read about it lol
it decide what it wants haha?
randomize?
AI lol
AI-CSS xdd
Brad
@bradtaniguchi
Feb 20 2018 19:10
I would start by inspecting the css of the cards themselves (they are all article tags)
Like this is the css selector being applied to the first card: .home-template .post-feed .post-card:nth-child(6n+1):not(.no-image)
Dany Din
@danydin
Feb 20 2018 19:11
i inspected them all , all are the same
Brad
@bradtaniguchi
Feb 20 2018 19:11
Not the first one
Dany Din
@danydin
Feb 20 2018 19:11
where u found it?
ahh i see so it applied to all of them but just the 6th child or so get effected?!
Brad
@bradtaniguchi
Feb 20 2018 19:11
Inspect the first artcile haha
Marit Fischer
@TheMarit
Feb 20 2018 19:12
@Dean if you inspect the first element (the big one): you see .post-card:nth-child(6n+1):not(.no-image) thats the magic
Dany Din
@danydin
Feb 20 2018 19:12
ahhh because i checked most but not the first one..
Brad
@bradtaniguchi
Feb 20 2018 19:12
besides the resposive stuff, which is prolly deeper
Dany Din
@danydin
Feb 20 2018 19:15
@bradtaniguchi @TheMarit thanks.. so ill check how the firsto ne infleunce all of those below it
CamperBot
@camperbot
Feb 20 2018 19:15
danydin sends brownie points to @bradtaniguchi and @themarit :sparkles: :thumbsup: :sparkles:
:cookie: 315 | @themarit |http://www.freecodecamp.org/themarit
:cookie: 382 | @bradtaniguchi |http://www.freecodecamp.org/bradtaniguchi
Brad
@bradtaniguchi
Feb 20 2018 19:15
@danydin Np :D
Dany Din
@danydin
Feb 20 2018 19:19
if i've a site where it manipulate through js i guess so i cant right click it with the mouse (so cant open in new tab) can i override it somehow? instead of go in and out everytime? @bradtaniguchi
Brad
@bradtaniguchi
Feb 20 2018 19:19
@danydin Not sure what your asking exactly
Dany Din
@danydin
Feb 20 2018 19:20
i think it ss or something
i cant see the url unless i go in it
Nate Mallison
@NJM8
Feb 20 2018 19:20
is anyone here using VS code?
I'm trying to setup my task runner just to open an html file in the browser
Brad
@bradtaniguchi
Feb 20 2018 19:23
@danydin Yea not 100% sure how you could go about doing that, it depends on how the redirect works. Odds are youd need to change the JS and html so it manipulates the link, rather than having JS redirect you
@NJM8 I use vs code, how come you need a task runner to open the html file?
Dany Din
@danydin
Feb 20 2018 19:24
how it called if i want to learn more about it? @bradtaniguchi
Brad
@bradtaniguchi
Feb 20 2018 19:25
@danydin At the end of the day (even if its using a framework or something) it comes down to this:
window.location = "http://www.yoururl.com"; (from SO)
Otherwise id google the subject
Nate Mallison
@NJM8
Feb 20 2018 19:25
@bradtaniguchi I want to just open what I'm working on in the browser, I gather the VS way to do that is to have a task runner that will open whatever file I'm working on after hitting shift-cmd-b
Dany Din
@danydin
Feb 20 2018 19:26
is it possible it is this?
ar globalZoneAwareCallback = function (event) {
        var target = this || _global;
        var tasks = target[zoneSymbolEventNames[event.type][FALSE_STR]];
        if (tasks) {
            // invoke all tasks which attached to current target with given event.type and capture = false
            // for performance concern, if task.length === 1, just invoke
            if (tasks.length === 1) {
                invokeTask(tasks[0], target, event);
            }
            else {
                // https://github.com/angular/zone.js/issues/836
                // copy the tasks array before invoke, to avoid
                // the callback will remove itself or other listener
                var copyTasks = tasks.slice();
                for (var i = 0; i < copyTasks.length; i++) {
                    invokeTask(copyTasks[i], target, event);
                }
            }
        }
    };
Brad
@bradtaniguchi
Feb 20 2018 19:28
@NJM8 Sorry, but Idk how to do this, I personally use a local-server (live-sever specifically) to serve my HTML. I don't play around with VS task runners, mainly because I use the terminal for most of this stuff (so I'm not locked into using vs code) I'd google it, or ask the main FCC room, more people there
Nate Mallison
@NJM8
Feb 20 2018 19:29
ok thanks.
I found all I need to do it in version 1.0 of the task runner, but they upgraded to 2.0 so it's different
What is the name of the main page?
Brad
@bradtaniguchi
Feb 20 2018 19:32
@danydin Idk what that code does
Looks to be part of angular tho, as I see angular's zonejs
Stephen James
@sjames1958gm
Feb 20 2018 19:33
This message was deleted
@NJM8 Live server is what I use. It monitors your html file for changes
Dany Din
@danydin
Feb 20 2018 19:34
yes makes sense, i also think they use kind of a framework, do you think it is like ajax call from serverside/api? @bradtaniguchi
Brad
@bradtaniguchi
Feb 20 2018 19:35
@danydin If it says angular in the comments of the code, its probably angular. I've never heard of any usage of zonejs outside of angular
Dany Din
@danydin
Feb 20 2018 19:36
yes its angular... but can they hide the url without connect it to a ss call in angular?
Brad
@bradtaniguchi
Feb 20 2018 19:37
@danydin Idk what you mean by ss call, or hide, not sure how its "shown" anyways
Dany Din
@danydin
Feb 20 2018 19:38
you just can not fetch the url before u go into the button
mustimuu
@mustimuu
Feb 20 2018 19:38
Hey guys
can someone help me
Brad
@bradtaniguchi
Feb 20 2018 19:38
Does the link keep on in the same "web-page" so like another part of the website/app
mustimuu
@mustimuu
Feb 20 2018 19:38
I want the same buttons as show on this site, when you hover
i inspected, but cant figure it out
Dany Din
@danydin
Feb 20 2018 19:38
totally different
if i rgiht click it it shows like u right click the chat input here ^
Brad
@bradtaniguchi
Feb 20 2018 19:39
If its a totally different page its probably deep in angular and redirects you using javascript. There's no easy what to know where that logic is
Dany Din
@danydin
Feb 20 2018 19:40
how it's calld this action in general if i want to learn about it.. how to do such a thing
mustimuu
@mustimuu
Feb 20 2018 19:40
guys how do i get the smae animation as on this site?
Geshtu
@Geshtu
Feb 20 2018 19:41
@mustimuu try right click force state, hover
that should display the a:hover css in your inspector
yep, just tried it. force hover on the a, not the li
(this is from after having the inspector up, under the elements tab)
Brad
@bradtaniguchi
Feb 20 2018 19:43
@danydin Its javascript, now unless you asking how Angular works, thats an entirely different story
Dany Din
@danydin
Feb 20 2018 19:44
so i can hide the url it goes to just with js? how this action called
Dany Din
@danydin
Feb 20 2018 19:46
perfect looks like what i want if it sends me to a total new url, thanks so much! @bradtaniguchi
CamperBot
@camperbot
Feb 20 2018 19:46
danydin sends brownie points to @bradtaniguchi :sparkles: :thumbsup: :sparkles:
api offline
Brad
@bradtaniguchi
Feb 20 2018 19:46
@danydin np :D
Dany Din
@danydin
Feb 20 2018 19:50
angular code is not shown in inspect elemnt?
mustimuu
@mustimuu
Feb 20 2018 19:53
guys can someone help me?
I want underline animation on my navigation
but i dont know how to do so
Brad
@bradtaniguchi
Feb 20 2018 19:55
@mustimuu I'm not sure what you want from the site
you need an a:hover {} css definition for your nav element
if it's a span, or a div, then span:hover
Can anyone spare a minute to take a look through the js on my local weather project? I'm not worried about aesthetics right now, more about proper structure for the jquery bit https://codepen.io/Geshtu/pen/eVMPyP
mustimuu
@mustimuu
Feb 20 2018 19:59
Can someone help me?
Brad
@bradtaniguchi
Feb 20 2018 19:59
@Geshtu I'll do a quick code review (im not caring about the logic, just structure and syntax)
Geshtu
@Geshtu
Feb 20 2018 20:04
Thanks Brad
@mustimuu do you have a link to what you're working on I can look at?
mustimuu
@mustimuu
Feb 20 2018 20:05
sure
hang on
Geshtu
@Geshtu
Feb 20 2018 20:05
/others can look at
Brad
@bradtaniguchi
Feb 20 2018 20:06
@Geshtu
  1. variable name apiurl should be renamed apiUrl
  2. you could refactor all jquery selectors and assign them to variables, so jquery doesn't have to lookup the element on call, rather you look them all up initially
  3. You could wrap your entire code in an iife so protect the global namespace
  4. you don't need to name your anonymous functions, alternatively you can define your functions at the bottom of the file, and just call the functions. This will leave your overall logic seperate from your implementation. Helps with readability
  5. Clean up some of the empty spacing
Oh yea and 6. don't declare all the variables at the top of the file if neccessary. If they are to be used locally, declare them locally (function level). No need to be able to access the position variable in the fccCall function
mustimuu
@mustimuu
Feb 20 2018 20:08
@Geshtu hang on
Geshtu
@Geshtu
Feb 20 2018 20:08
Makes a lot of sense, looks like I've got some reading to do - thanks again @bradtaniguchi !
CamperBot
@camperbot
Feb 20 2018 20:08
geshtu sends brownie points to @bradtaniguchi :sparkles: :thumbsup: :sparkles:
:cookie: 383 | @bradtaniguchi |http://www.freecodecamp.org/bradtaniguchi
Brad
@bradtaniguchi
Feb 20 2018 20:09
@Geshtu Yea np :D, otherwise your code looks fine. I mostly pointed out what I would consider minor stuff :)
Nate Mallison
@NJM8
Feb 20 2018 20:10
@sjames1958gm thanks for the tip on live server, looks good but it is serving the first folder in my workspace, not the HTML file I called it on, any ideas?
CamperBot
@camperbot
Feb 20 2018 20:10
njm8 sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 9000 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
mustimuu
@mustimuu
Feb 20 2018 20:12
@Geshtu did you look sir ?
Brad
@bradtaniguchi
Feb 20 2018 20:13
@NJM8 you can either run the server in the directory of where the folder is, or navigate in the URL or the live-server page to the file to view it
really dependant on you tho. Live-server can be configured to run a certain file/path with arguments (see the readme) or with a file
Geshtu
@Geshtu
Feb 20 2018 20:14
@mustimuu this section, if you remove it text-decoration-line:
underline
;
underlinea:-webkit-any-link
Nate Mallison
@NJM8
Feb 20 2018 20:14
I'm going to need to set it up to serve the filepath I'm currently in, it's just serving the first folder in my workspace
mustimuu
@mustimuu
Feb 20 2018 20:14
kk sec
Geshtu
@Geshtu
Feb 20 2018 20:15
and add 'nav a:hover { text-decoration-line: underline; }' to your css
mustimuu
@mustimuu
Feb 20 2018 20:15
i dont have any text-decoration lne
which line sir?
@Geshtu sir
Geshtu
@Geshtu
Feb 20 2018 20:20
sorry, I'm seeing the text-decoration (inspect, computed tab), but it isn't in your css file or on the page in style tags
Have to say, I'm a bit confused. You might try 'nav a { text-decoration:none;
then add the 'nav a:hover { text-decoration:underline; }
That should do the trick. Although I still have no idea about where/why the user agent stylesheets are missing from
mustimuu
@mustimuu
Feb 20 2018 20:45
Can someone help me out?
Cant make my animation to work on navigation link

¨¨¨
nav {
width: 100%;
height: 80px;
background-color: transparent;
line-height: 30px;
padding: 5px;
}

nav ul li {
list-style-type: none;
display: inline-block;
transition: 0.8s all;
text-transform: lowercase;
}

nav ul li a {
color: #fff;
margin: 20px;
padding-top: 10px;
padding-right: 10px;
text-decoration: none;
}

nav ul {
float: right;
}

nav a:hover {
text-decoration-line: underline;
}

nav ul li a:after {
content: "";
position: absolute;
width: 100%;
height: 2px;
bottom: 0;
left: 0;
background-color: #000;
visibility: hidden;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s
}

¨¨¨

Brad
@bradtaniguchi
Feb 20 2018 20:47
use ` characters not quotes (they are left of the 1 key)
mustimuu
@mustimuu
Feb 20 2018 20:47
"""

"""
nav {
width: 100%;
height: 80px;
background-color: transparent;
line-height: 30px;
padding: 5px;
}

nav ul li {
list-style-type: none;
display: inline-block;
transition: 0.8s all;
text-transform: lowercase;
}

nav ul li a {
color: #fff;
margin: 20px;
padding-top: 10px;
padding-right: 10px;
text-decoration: none;
}

nav ul {
float: right;
}

nav a:hover {
text-decoration-line: underline;
}

nav ul li a:after {
content: "";
position: absolute;
width: 100%;
height: 2px;
bottom: 0;
left: 0;
background-color: #000;
visibility: hidden;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s
}

"""

got damnit
Brad
@bradtaniguchi
Feb 20 2018 20:47
Just edit the same post, its the key with the ~ on it
mustimuu
@mustimuu
Feb 20 2018 20:48

´´´
nav {
width: 100%;
height: 80px;
background-color: transparent;
line-height: 30px;
padding: 5px;
}

nav ul li {
list-style-type: none;
display: inline-block;
transition: 0.8s all;
text-transform: lowercase;
}

nav ul li a {
color: #fff;
margin: 20px;
padding-top: 10px;
padding-right: 10px;
text-decoration: none;
}

nav ul {
float: right;
}

nav a:hover {
text-decoration-line: underline;
}

nav ul li a:after {
content: "";
position: absolute;
width: 100%;
height: 2px;
bottom: 0;
left: 0;
background-color: #000;
visibility: hidden;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s
}
´´´

oh go
god

´´´
nav {
width: 100%;
height: 80px;
background-color: transparent;
line-height: 30px;
padding: 5px;
}

nav ul li {
list-style-type: none;
display: inline-block;
transition: 0.8s all;
text-transform: lowercase;
}

nav ul li a {
color: #fff;
margin: 20px;
padding-top: 10px;
padding-right: 10px;
text-decoration: none;
}

nav ul {
float: right;
}

nav a:hover {
text-decoration-line: underline;
}´´´
nav ul li a:after {
content: "";
position: absolute;
width: 100%;
height: 2px;
bottom: 0;
left: 0;
background-color: #000;
visibility: hidden;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s
}´´´

Brad
@bradtaniguchi
Feb 20 2018 20:48
just edit the same post...
mustimuu
@mustimuu
Feb 20 2018 20:48
for god sake
hang on

´´´

´´´

Brad
@bradtaniguchi
Feb 20 2018 20:50
Looks like your backticks are backwards(?)
mustimuu
@mustimuu
Feb 20 2018 20:51

nav {
    width: 100%;
    height: 80px;
    background-color: transparent;
    line-height: 30px;
    padding: 5px;
}

nav ul li {
    list-style-type: none;
    display: inline-block;
    transition: 0.8s all;
    text-transform: lowercase;
}

nav ul li a {
    color: #fff;
    margin: 20px;
    padding-top: 10px;
    padding-right: 10px;
    text-decoration: none;
}

nav ul {
    float: right;
}

nav a:hover {
    text-decoration-line: underline;
}

nav ul li a:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    bottom: 0;
    left: 0;
    background-color: #000;
    visibility: hidden;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s
}
finally !!!!!!
thank you !
@bradtaniguchi thank
CamperBot
@camperbot
Feb 20 2018 20:51
mustimuu sends brownie points to @bradtaniguchi :sparkles: :thumbsup: :sparkles:
:cookie: 384 | @bradtaniguchi |http://www.freecodecamp.org/bradtaniguchi
Brad
@bradtaniguchi
Feb 20 2018 20:52
Np, post your question again, tho, cuse no one wants to scroll up to find out
mustimuu
@mustimuu
Feb 20 2018 20:52
@mustimuu
Can someone help me out?
Cant make my animation to work on navigation link
Conrad Kay
@conradkay
Feb 20 2018 20:53
anyone know any good guides to learning react-router?
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 20 2018 20:55
@bradtaniguchi frontticks?
Brad
@bradtaniguchi
Feb 20 2018 20:56
@MuhammedKarim probably, but I don't have that key so idk
I only have this one `
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 20 2018 20:57
@bradtaniguchi me too, i think its an apostrophe tbh '
Matej Bošnjak
@mbosnjak01
Feb 20 2018 20:58
@mustimuu show us your code
mustimuu
@mustimuu
Feb 20 2018 20:58
sec
Matej Bošnjak
@mbosnjak01
Feb 20 2018 20:58
possibly codepen
mustimuu
@mustimuu
Feb 20 2018 20:59
i got a link
hang on
here you go
Matej Bošnjak
@mbosnjak01
Feb 20 2018 21:04
@mustimuu show us your code
xD
you should put it in codepen
so we could test it
can't test js/jquery from devtools
mustimuu
@mustimuu
Feb 20 2018 21:06
ahhhh
sec
@mbosnjak01
@mbosnjak01 how do i share the link
Matej Bošnjak
@mbosnjak01
Feb 20 2018 21:16
and what kind of animation you want to acomplish?
mustimuu
@mustimuu
Feb 20 2018 21:23
@mbosnjak01
underline
easy in out
glandon22
@glandon22
Feb 20 2018 21:41
@mustimuu try deleting changing your nav a:hover rule
changing*
krckyboy
@krckyboy
Feb 20 2018 22:07

I'll just let it out here: if someone feels like helping me make the app which purpose would be importing and exporting google contacts, let me know. I can take care of the front-end part and I am willing to learn / help as much as I can with back-end (although not much, considering my lack of experience and knowledge at this point). Feel free to message me.

The idea of the app is to allow the user to create and send new google contacts to google account after using the token to connect to the associated google account (let's call this "importing new contacts"). The other part of the app would be exporting contacts (from google account to the app's DB). I suppose we need token, some authorization, and the usage of google API.

If someone is willing to help me out, I'd appreciate it. I need to do this assignment. I can take care of front-end on my own, but I don't know how to do the back-end alone.

Brad
@bradtaniguchi
Feb 20 2018 22:11
@krckyboy Just a quick thing I would like to mention, did you ever think about using app script for this?
Aditya
@ezioda004
Feb 20 2018 22:11
@mustimuu If I understood this correctly, you want to have transition on text-decoration: underline. According to this thread you cant do that but theres some better alternatives that you can do instead of that.
krckyboy
@krckyboy
Feb 20 2018 22:12
@bradtaniguchi I'm afraid I'm too inexperienced. I don't even know what you mean by that. I only did one web app which overextends the basic CRUD functionality of MongoDB and Express, and that's it. Would you be kind to tell me more about app script?
Brad
@bradtaniguchi
Feb 20 2018 22:14
@krckyboy You know googles stuff like docs, sheets, slides right? Well google supports a thing called app script, which is basically javascript that has access to some google apis. So you can do things like make calendar updates automatically, using a google sheet and an app script script
You can do a lot, ive seen systems build using a sheet as DB (I don't recommend it if things get too big, or you care about performance) but for some use cases its just right
krckyboy
@krckyboy
Feb 20 2018 22:15
@bradtaniguchi But can I implement that in an individual app of my own?
Brad
@bradtaniguchi
Feb 20 2018 22:15
If you wanted, you could make the backend in app script, and have it serve a front-end. But id consider it a small project idea than anything, as I said before it doesn't scale that well (but its free)
@krckyboy You can do basically anything you would do normally, but you have to deal with the app script API and environment
krckyboy
@krckyboy
Feb 20 2018 22:18
I think the potential employer wants this to implement into a bigger app, so dunno how good would be the use of app script.
But either way, I don't know how to make it.
And whether to learn Node more or go back to PHP because of more resources (even though also more trash and outdated material).
Brad
@bradtaniguchi
Feb 20 2018 22:19
@krckyboy Now if you want to build this for production use, and not* for fun or utility then yea don't use app script. But in that case must if be in node/php?
(more curious of your goals than anything)
krckyboy
@krckyboy
Feb 20 2018 22:22
@bradtaniguchi Well, at this point I can pick between Node or PHP and I am not interested in any other language.
I have made a very basic app which has CRUD functionality in PHP / MySQL and that's it. Recently, I got into learning Node for about a week or two and made a web app which is a bit more complex, has user authentication, different privileges for different users (admin and regular users), RESTful routes, etc. using Node and MongoDB, so I don't know what to do regarding the Google Contacts App that I should make.
This is the Node app that I made. The front end is poor. I was in a rush to make it for the exam and never got back to it since then.
Brad
@bradtaniguchi
Feb 20 2018 22:25
Well, I'm kinda confused what you want the app todo again (the main requirements for it), Is it just for exporting/creating google contacts?
Like is a google contacts (the app) clone?
@krckyboy
krckyboy
@krckyboy
Feb 20 2018 22:28
@bradtaniguchi Basically I don't know why we are supposed to make it, but the idea is to be able to do it on a different app and not on google.com while actually importing INTO the google acount and exporting contacts OUT of the google account, and by importing I mean creating new contacts and by exporting I mean copying contacts from google account and storing into web app's database.
The employer wants to use that part of the code that I am supposed to make and implement into an existing app that I don't have access to, yet.
Brad
@bradtaniguchi
Feb 20 2018 22:29
oh so this is a real project from an employer then*
krckyboy
@krckyboy
Feb 20 2018 22:29
A potential employer, but I wanna do it whether it's for him or nah, since it intrigues me.
My dad just died so I need to think of income.
Hoping to get a job, so I'm a bit stuck right now.
Brad
@bradtaniguchi
Feb 20 2018 22:30
I see, so I if you were hired (assuming thats part of this) you'd take what you learned and actually do it with their requirements. Until then your more or less doing it, just without and hard requirements
sorry for your loss
krckyboy
@krckyboy
Feb 20 2018 22:31
Thank you, bud. So, what is your advice now, for this situation?
The requirements are just there, to be able to import and export, using any back-end and can be done on localhost.
Brad
@bradtaniguchi
Feb 20 2018 22:33
I personally would try to do this yourself, if you want to learn as much as possible. (that's the goal right?) If you already know how to authenticate a user, I would use the same thing just with google authentication, and look into how to connect a node app to their APIs.
From there is more a how to use their api than anything. I wouldn't care that much about the front-end cuse it could be 2 buttons at this point (create, export)
@krckyboy Now the other part of this would be doing this on the right architecture. Like say you do node, but the potential employer doesn't want to pay for a nodejs instance (for example), then you'll need to do it in PHP (or whatever they want)
krckyboy
@krckyboy
Feb 20 2018 22:38
@bradtaniguchi I can pick whatever I want, regarding language. I'm just saying all the experience I got is Node and PHP (I did PHP only a year ago, and I don't remember most of it), where I did an APP in Node kinda recently.
Brad
@bradtaniguchi
Feb 20 2018 22:40
@krckyboy Yea I'm only pointing out if you want to do the most relevant thing for the possible employer. Now if you don't care that much then defiantly do node, I see no reason not too. But from what I understand about the project, I think you would be ok doing it by yourself. Would be a great learning experience, especially if you have the basics out of the way
krckyboy
@krckyboy
Feb 20 2018 22:41
To be honest I would just want to secure a job position and take a step back and go over the basics of Node once again, but I do agree that, if the situation was different, it would be a great learning experience to try and do it on my own.
@bradtaniguchi
Brad
@bradtaniguchi
Feb 20 2018 22:46
@krckyboy I mean I don't know the arrangements of this possible employer, so I can't say for sure then. To me it sounds more like you want to get this job with a project, but don't know how to do the main part (the utility part) of the project and need help.
Personally I'm pretty busy regardless so I can't lend much time even if it was for fun, nor am I a backend pro, but it sounds like a tough situation regardless
krckyboy
@krckyboy
Feb 20 2018 22:47
@bradtaniguchi Thank you very much for the info, nonetheless. :)
CamperBot
@camperbot
Feb 20 2018 22:47
krckyboy sends brownie points to @bradtaniguchi :sparkles: :thumbsup: :sparkles:
:cookie: 385 | @bradtaniguchi |http://www.freecodecamp.org/bradtaniguchi
Brad
@bradtaniguchi
Feb 20 2018 22:48
@krckyboy Np, and goodluck. I would defiantly try to do it yourself if you can (have time, and believe you can), cuse finding someone to do this with you might be difficult
krckyboy
@krckyboy
Feb 20 2018 22:49

@bradtaniguchi So the first part is google authentication, which should be easy to accomplish seeing that it's commonly used, even for Node, right?

The second one is dealing with google contacts API, right?

And then it's just figuring it out from there how to work with APIs.

Brad
@bradtaniguchi
Feb 20 2018 22:52
@krckyboy Yes, Google has a lot of documentation on doing this sort of stuff
Kersti McGee
@Kerstimcgee
Feb 20 2018 23:33
Hello! Does anyone know how to make my js and html in atom open in a chrome browser? When I try different packages, the best I could get it to do was open in browser (yay!) but it will only open the html, and not also the js from my atom. I open up the souce in js console only to see the html. Thoughts, anyone?
alpox
@alpox
Feb 20 2018 23:45
@Kerstimcgee you have to add the javascript file to the html document in the <head> as a <script> tag.
Kersti McGee
@Kerstimcgee
Feb 20 2018 23:48
Yes, I totally have. I just retraced. I am so new to this I can't see the problems. I followed a video and it looks the same as in the video. It was a Lynda.com course. Anyway, I'm not sure this is to be solved today, but I appreciate the article! Thanks, @alpox
CamperBot
@camperbot
Feb 20 2018 23:48
kerstimcgee sends brownie points to @alpox :sparkles: :thumbsup: :sparkles:
:star2: 1544 | @alpox |http://www.freecodecamp.org/alpox