These are chat archives for FreeCodeCamp/HelpFrontEnd

6th
Feb 2018
Arezohayeman
@Arezohayeman
Feb 06 2018 00:40
Hay
Ray Liriano
@mrlirianojr
Feb 06 2018 01:06
Hi
AbrisM
@AbrisM
Feb 06 2018 01:40
@mrlirianojr Hello
Manan Shah
@mananshah51
Feb 06 2018 02:03
@mrlirianojr Hello
Ray Liriano
@mrlirianojr
Feb 06 2018 02:05
@AbrisM @mananshah51 Hi Guys! I'm new :smile:
Gulsvi
@gulsvi
Feb 06 2018 02:06
Welcome! :sparkles:
Manan Shah
@mananshah51
Feb 06 2018 02:09
@mrlirianojr I also started with FCC last week. Let me know if I can help you in any ways.
AbrisM
@AbrisM
Feb 06 2018 02:38
@mrlirianojr Hi :)
German Gamboa Gonzalez
@germangamboa95
Feb 06 2018 03:24
Hello FFC community!
Tom
@moT01
Feb 06 2018 03:43
:wave: @germangamboa95
AbrisM
@AbrisM
Feb 06 2018 04:02
Hello German
Anyone use netbeans or intellij?
Also, can anyone tell me why my code isn't running? https://repl.it/repls/AcidicFarawayBittern why is it yelling on line 35 when it should be compiled and ready to run? This is a short script btw :)
AbrisM
@AbrisM
Feb 06 2018 04:08
"no suitable method found" and "not applicable"
German Gamboa Gonzalez
@germangamboa95
Feb 06 2018 04:16
@moT01 HI! what is everyone working on tonight? I'm trying to make a calendar with HTML and SCSS with plans to add javascript to make it interactive
DMsalati
@DMsalati
Feb 06 2018 04:20
hey guys can someone tell me why my icon is not working?
https://codepen.io/Muradmsalati/pen/aqNxvX?editors=1010
also you will need to open it in codepen for it to work properly
Nick
@rhozeta
Feb 06 2018 04:22
@DMsalati where is the path to the icon?
DMsalati
@DMsalati
Feb 06 2018 04:25
I am using the same api for the icons as the rest of the stuff, heres the api path https://fcc-weather-api.glitch.me/
also heres a direct link to the icon im using rn based on my location
https://cdn.glitch.com/6e8889e5-7a72-48f0-a061-863548450de5%2F50n.png?1499366021876
Claudio Restifo
@Marmiz
Feb 06 2018 04:32
@DMsalati I'm seeing a cloudy/sunny icon right now
DMsalati
@DMsalati
Feb 06 2018 04:35
@Marmiz ok i just tried it on edge and it worked fine, but for some reason its not working in chrome, what browser are you using ?
@Marmiz nvm i just reloaded and it worked there too mb sorry guys. thank you for pointing it out tho
CamperBot
@camperbot
Feb 06 2018 04:37
dmsalati sends brownie points to @marmiz :sparkles: :thumbsup: :sparkles:
:star2: 1144 | @marmiz |http://www.freecodecamp.org/marmiz
Claudio Restifo
@Marmiz
Feb 06 2018 04:37
:+1:
Jay Vora
@jayvora92
Feb 06 2018 05:03
i want return the value true if anyone of the defined varibale is true
'''
if({{var1}}=='true'||{{var2}}=='true')
{
return 'true';
}
'''
CamperBot
@camperbot
Feb 06 2018 05:03
:bulb: to format code use backticks! ``` more info
Jay Vora
@jayvora92
Feb 06 2018 05:03
i want return the value true if anyone of the defined varibale is true
if({{var1}}=='true'||{{var2}}=='true')
{
return 'true';
}
can anyone tell what is wrong
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 05:08
what this {{ syntax?
It should be just return var1 || var2;
or
if( var1 == true || var2 == true){
  return true;
}
Nishanth-S
@Nishanth-S
Feb 06 2018 07:38
My Angular app is behaving very weird, it is not printing navbar(using bootstrap classes), however, the webpack compiles successfully and other bootstrap components like buttons are printed correctly. How do I go about this?
Navbar code is correct and seems to run perfectly when put into static html
aRtoo
@artoodeeto
Feb 06 2018 07:51

hey guys who is using react? im trying react for the first time and i followed every instruction but i still get this error.

import React from 'react';
| ReactDOM.render(
> 513 |     <div>REACT REACT REACT NOW!!</div>, document.getElementById('root')
      |          ^
  514 | );

);

this is the simple code.

import React from 'react';
import ReactDOM from 'react-dom';

ReactDOM.render(
    <div>REACT REACT REACT NOW!!</div>, document.getElementById('root')
);

thats everything

Sorin Ruse
@sorinr
Feb 06 2018 07:52
@artoodeeto have u tried double quoting the html part?
aRtoo
@artoodeeto
Feb 06 2018 07:53
@sorinr just right now. yea it worked. i tried this " ' ' " didnt worked .i thougt theres something wrong with my install. thanks bri
CamperBot
@camperbot
Feb 06 2018 07:53
artoodeeto sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
Amit Patel
@AmitP88
Feb 06 2018 07:53
hey guys, I'm just about to start on the Random Quote Machine project on fcc and I was wondering, is it still worth learning Grunt or Gulp to use as a build system? or should I stick to Webpack? (I sort of have a basic understanding of webpack)
CamperBot
@camperbot
Feb 06 2018 07:53
:star2: 1398 | @sorinr |http://www.freecodecamp.org/sorinr
Sorin Ruse
@sorinr
Feb 06 2018 07:54
@artoodeeto great :)
aRtoo
@artoodeeto
Feb 06 2018 07:55
@sorinr hey bro can i ask one more?
Sorin Ruse
@sorinr
Feb 06 2018 07:56
@artoodeeto not good at react but go ask. if i can help i help
aRtoo
@artoodeeto
Feb 06 2018 07:56
@sorinr the <div> is being included in the rendeer bro.
Sorin Ruse
@sorinr
Feb 06 2018 07:57
@artoodeeto then u need to read this:https://reactjs.org/docs/rendering-elements.html
Randy
@RandyGoldsmith
Feb 06 2018 07:58
@artoodeeto did you include reactdom at the top? import react-dom from ReactDOM?
aRtoo
@artoodeeto
Feb 06 2018 07:58
@sorinr im confused why is it on the tutorial he didnt use any quotation mark.
yes sir i did
import React from 'react';
import ReactDOM from 'react-dom';
import React from 'react'; import ReactDOM from 'react-dom';
Sorin Ruse
@sorinr
Feb 06 2018 08:00
@artoodeeto because of jsx part of the react that translates it in html. i said to add double quotes just to see its working and rendering that string
aRtoo
@artoodeeto
Feb 06 2018 08:01
@sorinr yea it worked but did it like this sir. " <div> ... </div> it included the tag
Randy
@RandyGoldsmith
Feb 06 2018 08:02
@artoodeeto which excercise is this?
aRtoo
@artoodeeto
Feb 06 2018 08:03
@RandyGoldsmith ohh this is in udemy . this is an es6 lesson but hes just showing the uses of es6 in react. heres the link
https://www.udemy.com/es6-in-depth/learn/v4/t/lecture/6557930?start=0
Sorin Ruse
@sorinr
Feb 06 2018 08:05
@artoodeeto yes i know. it was just rendering the string "div .... /div" (sorry too lazy now). it also could be render('Hello world!", getelement...bla bla bla)so thats why i sent you the link above. just to see how to render jsx
aRtoo
@artoodeeto
Feb 06 2018 08:07
@sorinr yea. the link you gave me they didnt use any quote but ill ask someone else bro. thank you for you help. go to sleep bro its 3:07am now. lols
CamperBot
@camperbot
Feb 06 2018 08:07
artoodeeto sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
api offline
Sorin Ruse
@sorinr
Feb 06 2018 08:08
@artoodeeto sorry. plz read "lazy"="too tired". havent got some sleep in the last 30 hours
aRtoo
@artoodeeto
Feb 06 2018 08:09
@sorinr haha. go to sleep bro.
Sorin Ruse
@sorinr
Feb 06 2018 08:11
@artoodeeto i hear my bed its calling me :)
Claudio Restifo
@Marmiz
Feb 06 2018 08:15
How are you converting JSX @artoodeeto ?
aRtoo
@artoodeeto
Feb 06 2018 08:15
@Marmiz what do you mean sir?
@Marmiz im using webpack? is that what you mean?
Claudio Restifo
@Marmiz
Feb 06 2018 08:16
using html inside JS is JSX, and need to be converted :)
(usually with babel)

try:

ReactDOM.render(
  React.CreateElement('div', null, 'Hello World'),
  document.getElementById('root')
);

and see if it works

aRtoo
@artoodeeto
Feb 06 2018 08:18
@Marmiz i have babel to sir
@Marmiz npm install babel-preset-react react react-dom react-bootstrap --save-dev this are the presets the i installed sir. i think this is the problem.
Claudio Restifo
@Marmiz
Feb 06 2018 08:22
@artoodeeto if you just want to prototipe just use create-react-app...
otherwise you need to set webpack as well as babel. And that can be confusing especially if you just want to try it out
aRtoo
@artoodeeto
Feb 06 2018 08:22
@Marmiz maybe i just need sleep too. haha. thank you sir. appreciate the help
CamperBot
@camperbot
Feb 06 2018 08:22
artoodeeto sends brownie points to @marmiz :sparkles: :thumbsup: :sparkles:
:star2: 1145 | @marmiz |http://www.freecodecamp.org/marmiz
Claudio Restifo
@Marmiz
Feb 06 2018 08:23
Or there are online editors that lets you prototype with React.
i like https://codesandbox.io/
aRtoo
@artoodeeto
Feb 06 2018 08:27
@Marmiz thanks sir
CamperBot
@camperbot
Feb 06 2018 08:27
artoodeeto sends brownie points to @marmiz :sparkles: :thumbsup: :sparkles:
api offline
Karthik
@karthik-ir
Feb 06 2018 08:54

hello ,
I'm new to es6
I'm trying to understand the below code

import React from 'react'

const ListingPage = ({onListingPageLoad}) => {
    return(
        <div>

            "Some text value"
        </div>
    )
}

How does this create a listingPage component?

I tried converting this to es5 using babel traanspiler online and it knows its a create component. I'm just wondering how.

Also how can i add componentDidMount() in this code?

DMsalati
@DMsalati
Feb 06 2018 09:29
can someone help me? not really sure how to make $.toggle work with ajax its not showing. Also when im displaying the temp i want there to be a space between the unit and number but its not doing it can someone explain to me why its not working please? its been frustrating me for the past hour
https://codepen.io/Muradmsalati/pen/gvMyYb?editors=1010
abyshukla
@abyshukla
Feb 06 2018 09:34
Hey guys, what is the problem with this jquery?
https://codepen.io/aby_shukla/pen/aqZgNw
dinesh
@1532j0004kg
Feb 06 2018 09:36
test is id
DMsalati
@DMsalati
Feb 06 2018 09:36
you need to add a # in $("#test")
dinesh
@1532j0004kg
Feb 06 2018 09:36
give the # before
add bootstrap and jquery in settings ! @abyshukla
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 06 2018 09:39
can anyone advise me how to improve this please?
https://codepen.io/MuhammedK/full/KQzRXe/
dinesh
@1532j0004kg
Feb 06 2018 09:40
why u didn't css tab ,?!
abyshukla
@abyshukla
Feb 06 2018 09:42
@1532j0004kg I added the jquery. do not need bootstrap
DMsalati
@DMsalati
Feb 06 2018 09:42
i would add some color to it, it looks very bland
dinesh
@1532j0004kg
Feb 06 2018 09:42
yup @abyshukla
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 06 2018 09:42
@DMsalati background colour?
dinesh
@1532j0004kg
Feb 06 2018 09:43
then add #test dont just put test
in js
abyshukla
@abyshukla
Feb 06 2018 09:43
doesn't work @DMsalati :(
DMsalati
@DMsalati
Feb 06 2018 09:44
@MuhammedKarim possibly and maybe pictures of the recipes too?
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 06 2018 09:45
ok, good idea, thanks :) @DMsalati
CamperBot
@camperbot
Feb 06 2018 09:45
muhammedkarim sends brownie points to @dmsalati :sparkles: :thumbsup: :sparkles:
:cookie: 167 | @dmsalati |http://www.freecodecamp.org/dmsalati
DMsalati
@DMsalati
Feb 06 2018 09:48
@abyshukla try using getjson instead of ajax its basically the same thing
abyshukla
@abyshukla
Feb 06 2018 09:49
I was using getJSON in my other pen. Same thing. Like @Masd925 said, it is a crossorigin issue
sadly http://crossorigin.me is dead slow
Edit: crossorigin.me is dead
Aditya
@ezioda004
Feb 06 2018 10:01
@abyshukla Remove crossorigin.me from url and try adding &origin=*
abyshukla
@abyshukla
Feb 06 2018 10:02
ok @ezioda004
Still the same @ezioda004
https://codepen.io/aby_shukla/pen/aqZgNw
Aditya
@ezioda004
Feb 06 2018 10:06
@abyshukla Its working now, do console.log(wikiJson) inside the success function, and you'll see an object
dinesh
@1532j0004kg
Feb 06 2018 10:07
$("button").click(function(){
$.ajax({
  type: "GET",
  url:
    "https://en.wikipedia.org/w/api.php?action=opensearch&search=api&limit=10&namespace=0&format=jsonfm&origin=*",
  //dataType : jsonp,
  success: function(wiki) {
  $("#test").html(wiki);
  //console.log(wiki)
  },
  error: function(err) {
    $("#test").text(err);
  }
});
});
try this its working !
@abyshukla
Aditya
@ezioda004
Feb 06 2018 10:07
Also I'd suggest removing async: false, its deprecated
hensn5250
@hensn5250
Feb 06 2018 10:11
@ezioda004 did you complete the Frontend Cert?
abyshukla
@abyshukla
Feb 06 2018 10:12
It did not work in the pen. I can see the data though
Aditya
@ezioda004
Feb 06 2018 10:13
@hensn5250 Making the last project, portfolio and then I'm done ^^
hensn5250
@hensn5250
Feb 06 2018 10:14
the last project is a portfolio?
abraham anak agung
@padunk
Feb 06 2018 10:15
@abyshukla it work, the problem is you can't display object with .html try console.log(wikiJson.query.pages); and it show you all the query you ask
try this and you will see it $('#test').html(wikiJson.query.pages[11557106].title);
hensn5250
@hensn5250
Feb 06 2018 10:17
I'm on the twitch app. I saw your codepen page. Good stuff
Aditya
@ezioda004
Feb 06 2018 10:17
@hensn5250 Nah last is simon, but I didnt do portfolio one before cause I wanted to make a nice portfolio.
hensn5250
@hensn5250
Feb 06 2018 10:17
Oh ok
Aditya
@ezioda004
Feb 06 2018 10:17
Thanks, not that good at css but I've tried
hensn5250
@hensn5250
Feb 06 2018 10:18
well if ever you want to collab in the future I'm up for it. I'm 2 projects behind at the moment but just putting it out there.
Later.
Aditya
@ezioda004
Feb 06 2018 10:19
@hensn5250 I will keep that in mind :)
abyshukla
@abyshukla
Feb 06 2018 10:20
thanks guys @ezioda004 @1532j0004kg @padunk
CamperBot
@camperbot
Feb 06 2018 10:20
abyshukla sends brownie points to @ezioda004 and @1532j0004kg and @padunk :sparkles: :thumbsup: :sparkles:
:cookie: 274 | @1532j0004kg |http://www.freecodecamp.org/1532j0004kg
:cookie: 434 | @ezioda004 |http://www.freecodecamp.org/ezioda004
:cookie: 425 | @padunk |http://www.freecodecamp.org/padunk
Ayush Bahuguna
@relentless-coder
Feb 06 2018 10:23
export const Client = (props)=>{
    return (
        <div className="client">
            <Sidebar props={props}/>
            <Switch>
                <Route exact path="/clients" component={AllClients}/>
                <Route exact path="/clients/:clientId" component={SingleClient}/>
                <Route exact path="/clients/:clientId/branches" component={Branches}/>
            </Switch>
        </div>
    );
};
do i need to place the exact attribute in every route?
abraham anak agung
@padunk
Feb 06 2018 10:24
@relentless-coder in your case yes, cause the start of the path have the same name /clients
Ayush Bahuguna
@relentless-coder
Feb 06 2018 10:27
@padunk so this is normal?
abraham anak agung
@padunk
Feb 06 2018 10:28
@relentless-coder yes
except you have different path name like / /home /product etc than you need to place exact only on /
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 06 2018 10:30
how can i set these apart?
image.png
Aditya
@ezioda004
Feb 06 2018 10:32
@MuhammedKarim If you're using flex then can do justify-content: space-between;
Ayush Bahuguna
@relentless-coder
Feb 06 2018 10:34
@padunk sure, thank you
CamperBot
@camperbot
Feb 06 2018 10:34
relentless-coder sends brownie points to @padunk :sparkles: :thumbsup: :sparkles:
:cookie: 429 | @padunk |http://www.freecodecamp.org/padunk
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 06 2018 10:44
@ezioda004 would it work with display:inline-block?
Aditya
@ezioda004
Feb 06 2018 10:47
@MuhammedKarim Dont think so, if you're not using flex then I guess you can use margin-right: Xpx; on the left div to give space b/w them.
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 06 2018 11:02
with display:flex this happens
image.png
@ezioda004
Aditya
@ezioda004
Feb 06 2018 11:10
@MuhammedKarim Do you have codepen link?
@ezioda004
Aditya
@ezioda004
Feb 06 2018 11:16
Oh its a table
You can wrap them up in a div and then use flex
I removed display: flex; from the table and img since its not needed
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 06 2018 11:18
then there's too much space between them! @ezioda004
Aditya
@ezioda004
Feb 06 2018 11:18
Ok then you can do justify-content: space-around;
I updated it
You can play with the space with flex property of the items.
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 06 2018 11:21
it's not working on my one for some reason
i need to use inline styles coz its a project for Khan Academy and they don't have seperate CSS tab @ezioda004
Aditya
@ezioda004
Feb 06 2018 11:23

You need to wrap the <table> and <img> inside a <div>
Like this

<div>
    <table>
     </table>
     <img>
</div>

then remove the display:flex from your inline table styling

Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 06 2018 11:24
that's precisely what i did, can you check mine again please?
Aditya
@ezioda004
Feb 06 2018 11:24

And add

display: flex;
  justify-content: space-around;

to the above div

Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 06 2018 11:24
i did! :( @ezioda004
oh got it now, i just merged the inline styles!
thanks a lot :) @ezioda004
CamperBot
@camperbot
Feb 06 2018 11:25
muhammedkarim sends brownie points to @ezioda004 :sparkles: :thumbsup: :sparkles:
:cookie: 435 | @ezioda004 |http://www.freecodecamp.org/ezioda004
Aditya
@ezioda004
Feb 06 2018 11:26
@MuhammedKarim Awesome :thumbsup:
Puyan Wei
@puyanwei
Feb 06 2018 11:33

Hi, I'm trying to write some tests for my single page app which uses logic. As a start I want to press and button and have a number appear on the page. I have gotten zombie.js to press the button, but the outcome doesn't change. Do any of you guys know if the zombie js headless browser works with JQuery/DOM manipulation? I have other passing tests working that asserts elements on the page.

My test;

const Browser = require("zombie");
var chai = require("chai"),
  expect = chai.expect,
  should = chai.should();

var should = require("chai").should();
var url = "http://localhost:8080/";

describe("User visits page", function() {
  const browser = new Browser();

  before(function() {
    return browser.visit(url);
  });

describe("submits form", function() {
    it("should be successful", function(done) {
      return browser.pressButton("1", function() {
        browser.text("#first").should.equal("1");
        done();
      });
    });
  });
});

Sorry not sure if this should go front end or back end.

Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 06 2018 11:45
how can i change the contents to make it look better?
does the page look better?
https://codepen.io/MuhammedK/full/KQzRXe/
abyshukla
@abyshukla
Feb 06 2018 11:51
Wiki Search done. Please review
https://codepen.io/aby_shukla/full/jZrNEX/
CamperBot
@camperbot
Feb 06 2018 11:51

freeCodeCamp Wiki:

:point_right: The freeCodeCamp wiki can be found on our forum.
Please follow the link and search there.
Arezohayeman
@Arezohayeman
Feb 06 2018 11:52
I ask friends to give someone a dollar for an orphan's surgery. I'm collecting money for action(.Z496695675778)
Marianissimus
@Marianissimus
Feb 06 2018 12:33
@abyshukla the search results display in the console, but not on page
abyshukla
@abyshukla
Feb 06 2018 12:44
Sorry. You can try now. I was fiddling with it... Was trying to generate search by pressing enter @Marianissimus
ahmed-issa-mohd
@ahmed-issa-mohd
Feb 06 2018 12:49
I don't understand perspective-origin in css can you help me ?
Lean Junio
@leanjunio
Feb 06 2018 12:50
Hey guys, how does your team get their users' banking information? Just for the front end part?
LydaTech
@lydatech
Feb 06 2018 13:42
@leanjunio banking info?
Stephen Chow
@stevchow
Feb 06 2018 13:59
Hello, I am just started beta version of freecodecamp, and stuck in "Create a Set of Radio Buttons" section. The webpage show I complete the challenge but I can't go to the next challenge. It say "something went wrong try again later". I have try logging out and clicking the map in nav bar, but it doesn't work. Any solution?
Teo
@Teo03
Feb 06 2018 14:02
Can someone help me. I don't know how to prevent opening other recipes when I click on just one of them. Here is my code:
import React from 'react';
import { Collapse, Button, CardBody, Card } from 'reactstrap';

export class ShowRecipes extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            collapse: false
        }
        this.toggle2 = this.toggle2.bind(this);
      }

      toggle2() {
        this.setState({ collapse: !this.state.collapse });
      }

    render(){  
        var recipeList = this.props.recipes.map(function(recipeInfo, index, e){
            return (
        <div className="recipe-list">
        <h1 id={recipeInfo.title} onClick={(e) => {this.toggle2(e); e.nativeEvent.stopImmediatePropagation()}}>{recipeInfo.title}</h1>
        <Collapse isOpen={this.state.collapse}>
          <Card>
            <CardBody>
            {recipeInfo.instructions}
            </CardBody>
          </Card>
        </Collapse>
        </div>
            );
        }, this);
        return recipeList;
    }
}
Here is also a github link: https://github.com/Teo03/recipe_box
Stephen Chow
@stevchow
Feb 06 2018 14:06
just solved it by manually type the next challenge link
Stephen James
@sjames1958gm
Feb 06 2018 14:22
@Teo03 You collapse state should identify which recipe is collapsed/open
You could store the index of the open recipe in your state rather than just a boolean
@Teo03 Your property isOpen could be (if you stored the open index in the state)
isOpen={ this.state.open === index}
dinesh
@1532j0004kg
Feb 06 2018 14:23
@sjames1958gm hi
Stephen James
@sjames1958gm
Feb 06 2018 14:23
@1532j0004kg :wave:
dinesh
@1532j0004kg
Feb 06 2018 14:24
can u please help me to learn loginsystem @sjames1958gm \
with authentication
Nate Mallison
@NJM8
Feb 06 2018 14:25
@sjames1958gm After that can you help me with my problem on HelpBackEnd?? :smile:
Stephen James
@sjames1958gm
Feb 06 2018 14:25
@1532j0004kg I am at work, so I cannot devote any time right now.
I can answer one off questions - that's about it
Nate Mallison
@NJM8
Feb 06 2018 14:26
@1532j0004kg What are you using for database?
Nick
@rhozeta
Feb 06 2018 14:26
anyone have any experience with passport.js?
dinesh
@1532j0004kg
Feb 06 2018 14:26
@sjames1958gm ok np
carryon
@NJM8 mongo
Nate Mallison
@NJM8
Feb 06 2018 14:27
@1532j0004kg I've been using bcrypt for now, check out this tutorial. https://www.rithmschool.com/courses/intermediate-node-express
dinesh
@1532j0004kg
Feb 06 2018 14:27
ohh ok
in authentication i want to know onething .
Nate Mallison
@NJM8
Feb 06 2018 14:28
@rhozeta I don't yet but there is some basics on that Rithm School tutorial above, maybe that will help?
Nick
@rhozeta
Feb 06 2018 14:28
@NJM8 ah thatas looks like a good resource, thanks
CamperBot
@camperbot
Feb 06 2018 14:28
rhozeta sends brownie points to @njm8 :sparkles: :thumbsup: :sparkles:
:cookie: 297 | @njm8 |http://www.freecodecamp.org/njm8
Nate Mallison
@NJM8
Feb 06 2018 14:29
Sure thing, I've found a bunch of their stuff to be great
dinesh
@1532j0004kg
Feb 06 2018 14:30
if i post anything with my profile logged in .
i want to store in my dashboard only
so how to store the data in database ?\
@NJM8
Nate Mallison
@NJM8
Feb 06 2018 14:32
@1532j0004kg You I think are looking for a one to many relationship. so a user database and a posts database. the user has an array of ids linking to posts. each post only has one linking id relating to it's owner
dinesh
@1532j0004kg
Feb 06 2018 14:32
i mean , everyone have their unique dashboard , must be only visible to them only
Nate Mallison
@NJM8
Feb 06 2018 14:32
yup
That's basically what I'm making now for a basic shopping list app with admin functionality as well. going on Heroku! They will show you all that.
dinesh
@1532j0004kg
Feb 06 2018 14:35
thankyou i will go through this link and give u the status , @NJM8 thanks and congrats ! for ur project :sparkles:
CamperBot
@camperbot
Feb 06 2018 14:35
1532j0004kg sends brownie points to @njm8 :sparkles: :thumbsup: :sparkles:
:cookie: 298 | @njm8 |http://www.freecodecamp.org/njm8
Nate Mallison
@NJM8
Feb 06 2018 14:35
Sure thing, good luck!
dinesh
@1532j0004kg
Feb 06 2018 14:36
so where i can start with fundamentals or intermediate ?
Nate Mallison
@NJM8
Feb 06 2018 14:37
do fundamentals first
It'll teach you the database and routing stuff, then intermediate adds authentication
dinesh
@1532j0004kg
Feb 06 2018 14:38
ok :+1:
is the video is enough to learn or i want to look through the words ?
@NJM8
Nate Mallison
@NJM8
Feb 06 2018 14:46
@1532j0004kg I would read it too, it'll help a lot
And check out all the links
dinesh
@1532j0004kg
Feb 06 2018 14:47
:+1: done thanks a lot @NJM8
CamperBot
@camperbot
Feb 06 2018 14:47
1532j0004kg sends brownie points to @njm8 :sparkles: :thumbsup: :sparkles:
api offline
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 06 2018 15:38
image.png
how can i make this contents look good...?
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 15:40
@MuhammedKarim add bootstrap
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 06 2018 15:42
which style?
is there a bootstrap contents style?
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 15:49
@MuhammedKarim checkout their list groups
Matej Bošnjak
@mbosnjak01
Feb 06 2018 15:49
Just style it with css. Few tips. Remove link underline, add some font, replace numbers with unordered list ...
get creative XD
maybe even some hover color changing effect with 0.5 seconds of transition
Singh Harpal
@harry9656
Feb 06 2018 15:59
Hi can someone give me some feedback on this: https://codepen.io/harry9656/full/RQRLvy/ ??
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 16:01
@harry9656 I didn't understand a word in it, except your name.. But the content organization and placement is very neat
Sweet font as well
Singh Harpal
@harry9656
Feb 06 2018 16:01
it was made with bootstrap 4 and not bootstrap 3 as they teach you on fcc. My initial idea was to make a quick template as possible but, I ended up using most of my time learning bootstrap 4
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 16:01
@harry9656 : good work
:+1:
Singh Harpal
@harry9656
Feb 06 2018 16:01
@SweetCodingInc yeah I didn't bother to translate from italian to english
thanks
@SweetCodingInc thanks
CamperBot
@camperbot
Feb 06 2018 16:01
harry9656 sends brownie points to @sweetcodinginc :sparkles: :thumbsup: :sparkles:
:cookie: 243 | @sweetcodinginc |http://www.freecodecamp.org/sweetcodinginc
Singh Harpal
@harry9656
Feb 06 2018 16:02
can you tell me if the button are working?
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 16:02
@harry9656 Also, I'd add some smooth scroll effect when you click on the links in navbar
Singh Harpal
@harry9656
Feb 06 2018 16:02
i tried to make popovers for the first time
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 16:02
you mean tooltips?
yeah, those are working
Sorry I don't have any account :P
Singh Harpal
@harry9656
Feb 06 2018 16:03
@SweetCodingInc yeah whatever are they called :satisfied:
@SweetCodingInc I could add smooth scroll but it is not my main concern, right now i want to go deep into js.....
thanks again for the feedback
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 16:04
@harry9656 :+1:
AbrisM
@AbrisM
Feb 06 2018 16:32
Hi all, could someone tell me why i'm having a println error for this? https://onlinegdb.com/H1Hfu8DIf
aRtoo
@artoodeeto
Feb 06 2018 16:40
@AbrisM you forgot to close the comment bro on line one

hey anyone using react its my first time how i still get an error using JSX but everything on my json.package is installed.
@Marauder @Kai

  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-cli": "^6.26.0",
    "babel-core": "^6.26.0",
    "babel-loader": "^7.1.2",
    "babel-polyfill": "^6.26.0",
    "babel-preset-env": "^1.6.1",
    "babel-preset-es2016": "^6.24.1",
    "babel-preset-es2017": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "react": "^16.2.0",
    "react-bootstrap": "^0.32.1",
    "react-dom": "^16.2.0",
    "webpack": "^3.10.0",
    "webpack-dev-server": "^2.11.1"
  },
  "presets": [
    "env",
    "react"
  ],
  "dependencies": {
    "create-react-app": "^1.5.1",
    "start": "^5.1.0"
  }
}

thats inside my package.json bros.

Vlad Fernandes
@Vlad-Fernandes
Feb 06 2018 16:45
@artoodeeto what's the error ?
aRtoo
@artoodeeto
Feb 06 2018 16:46
@vieira83 this one bro.
`<div>REACT REACT REACT NOW!!</div>, document.getElementById('root');
@vieira83 the tag bro
Vlad Fernandes
@Vlad-Fernandes
Feb 06 2018 16:48
without seeing the code is hard to tell
are you using webpack to transpile?
and run the webpack to compile
Razvan Jackson
@RazvanJackson
Feb 06 2018 17:20
Hey guys!
html,body{
    margin: 0px;
    padding: 0px;
}

body{
    height: 100%;
    background: #929292;
    background-size: 100% 100%;
    overflow: visible;
}
why do i have a little gap down page
like html is not going all the way down
Eric Weiss
@eweiss17
Feb 06 2018 17:29
what is the question?
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 06 2018 17:41
@mbosnjak01 thanks for the creative ideas lol imma try to do them
CamperBot
@camperbot
Feb 06 2018 17:41
muhammedkarim sends brownie points to @mbosnjak01 :sparkles: :thumbsup: :sparkles:
:cookie: 227 | @mbosnjak01 |http://www.freecodecamp.org/mbosnjak01
dinesh
@1532j0004kg
Feb 06 2018 17:58
guys what is the purpose of origin=*
Stephen James
@sjames1958gm
Feb 06 2018 18:01
@1532j0004kg For the Wikimedia API it signals the far end to send the correct headers in the response so as to avoid CORS problems.
dinesh
@1532j0004kg
Feb 06 2018 18:02
sry , cant get .
can u please explain with another word ?
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 18:09

@1532j0004kg When you request data from ajax, by default, it is a strict requirement that the client and server MUST exist on same host.
Now, typically that is not the case. Let's say your code runs on codepen.io and you request data from wikipedia api wikipedia.org - then by security standards, the browser will block this request. Because you're sending ajax request from codepen.io to wikipedia.org
This is considered as a security threat.

To address this problem, you server must send particular headers in the response. That header is Access-Control-Allow-Origin. The value of this header tells the browser if the server is a legitimate server. If the value of this header matches with your domain (which is codepen.io), then the browser will allow this request.

origin=* will cause the wikipedia API to set a header Access-Control-Allow-Origin to *
which means, this server allows ajax (XMLHttpRequest) from any domain or origin
dinesh
@1532j0004kg
Feb 06 2018 18:12
server is wikipedia ?
@SweetCodingInc
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 18:15
@1532j0004kg it's wikipedia.org - the hostname
it's just an example
but it applies to all the servers out there..
dinesh
@1532j0004kg
Feb 06 2018 18:15
in this example wiki right ?
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 18:15
more specifically, a server that is hosted at wikipedia.org
yes
devlyn
@devlohnes13
Feb 06 2018 18:15
anyone look at the personal portfolio project code and just get absolutely lost?
dinesh
@1532j0004kg
Feb 06 2018 18:16
@SweetCodingInc thanks a lot :fire:
CamperBot
@camperbot
Feb 06 2018 18:16
1532j0004kg sends brownie points to @sweetcodinginc :sparkles: :thumbsup: :sparkles:
:cookie: 247 | @sweetcodinginc |http://www.freecodecamp.org/sweetcodinginc
dinesh
@1532j0004kg
Feb 06 2018 18:17
  • means what @SweetCodingInc
*
in orgin = *
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 18:19
I can't see your question clearly
it just shows 2 dots...
coderNewby
@coderNewby
Feb 06 2018 18:19
@DarrenfJ thanks, I added GitHub what is next?
CamperBot
@camperbot
Feb 06 2018 18:19
codernewby sends brownie points to @darrenfj :sparkles: :thumbsup: :sparkles:
:star2: 2379 | @darrenfj |http://www.freecodecamp.org/darrenfj
Darren
@DarrenfJ
Feb 06 2018 18:20
@coderNewby thanks test test
thanks @coderNewby
CamperBot
@camperbot
Feb 06 2018 18:20
darrenfj sends brownie points to @codernewby :sparkles: :thumbsup: :sparkles:
:cookie: 5 | @codernewby |http://www.freecodecamp.org/codernewby
Darren
@DarrenfJ
Feb 06 2018 18:20
ok, you are good to go. they're linked now
dinesh
@1532j0004kg
Feb 06 2018 18:20
in origin=* * refers what ?
@SweetCodingInc
coderNewby
@coderNewby
Feb 06 2018 18:21
thanks @Darren
CamperBot
@camperbot
Feb 06 2018 18:21
codernewby sends brownie points to @darren :sparkles: :thumbsup: :sparkles:
:cookie: 70 | @darren |http://www.freecodecamp.org/darren
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 18:21
@1532j0004kg I see
Gulsvi
@gulsvi
Feb 06 2018 18:21
@devlohnes13 There is a mix of basic and intermediate code in that project. Many people add the more difficult code later after completing other projects
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 18:21
* means anything
Gulsvi
@gulsvi
Feb 06 2018 18:21
If you have a question about any of the code, feel free to ask @devlohnes13
dinesh
@1532j0004kg
Feb 06 2018 18:21
@SweetCodingInc :+1:
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 18:21
requests from any and all origin(s) are allowed
dinesh
@1532j0004kg
Feb 06 2018 18:22
thanks a lot :+1:
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 18:24
@1532j0004kg :+1:
dinesh
@1532j0004kg
Feb 06 2018 18:24
we can give origin as codepen.io here
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 18:24
you can...
dinesh
@1532j0004kg
Feb 06 2018 18:24
?
:+1:
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 18:25
Read this if you want detailed technical specs - https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
CORS- Cross Origin Resource Sharing
dinesh
@1532j0004kg
Feb 06 2018 18:25
so its help the wikipedia to know from where the request is coming from right ?
devlyn
@devlohnes13
Feb 06 2018 18:25
thank you @gulsvi !
CamperBot
@camperbot
Feb 06 2018 18:25
devlohnes13 sends brownie points to @gulsvi :sparkles: :thumbsup: :sparkles:
:star2: 2586 | @gulsvi |http://www.freecodecamp.org/gulsvi
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 18:29
@1532j0004kg wikipedia doesn't care where the request comes from. Your browser cares what responses to accept
Singh Harpal
@harry9656
Feb 06 2018 18:30
Is up anyone?? need confirmation for a bug...
dinesh
@1532j0004kg
Feb 06 2018 18:30
then y we sending our domain in origin
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 18:30
to let your browser know that it should accept responses from wikipedia, the wikipedia response must contain a header Access-Control-Allow-Origin that matches with your domain
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 18:30
so it can be either codepen.io or some random wildcard *
dinesh
@1532j0004kg
Feb 06 2018 18:31
:+1:
so i must to learn the purpose of headers in request :smile:
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 18:32
@1532j0004kg Yes
Eric Weiss
@eweiss17
Feb 06 2018 18:32
@harry9656 what is your problem
Singh Harpal
@harry9656
Feb 06 2018 18:33
test cases doesn't match with instructions
Eric Weiss
@eweiss17
Feb 06 2018 18:33
did you do what is said, Initialize the three variables a, b, and c with 5, 10, and "I am a"
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 18:33
Hello people!!!
Eric Weiss
@eweiss17
Feb 06 2018 18:34
test cases is what the values equal after they perform the code in the 'do not change' section
Singh Harpal
@harry9656
Feb 06 2018 18:34
ok it was my fault
thanks
I was doing something else
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 06 2018 18:35
Hi! @Boris-the-Llama
Singh Harpal
@harry9656
Feb 06 2018 18:35
@eweiss17 thanks
CamperBot
@camperbot
Feb 06 2018 18:35
harry9656 sends brownie points to @eweiss17 :sparkles: :thumbsup: :sparkles:
:cookie: 605 | @eweiss17 |http://www.freecodecamp.org/eweiss17
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 18:35
hi @MuhammedKarim !
does anyone know if in js when making the background a random colour you can exclude certain colours, like white?
if you understand me
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 06 2018 18:37
Sorry, I'm terrible at JS :( @Boris-the-Llama
Gulsvi
@gulsvi
Feb 06 2018 18:38
@Boris-the-Llama Yes, it's possible to do that in JS. How to do it depends on the code you are using ;)
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 18:39
im using this;
var hex = Math.floor(Math.random() * 0xFFFFFF);
return "#" + ("000000" + hex.toString(16)).substr(-6);
95% of the time it is fine, though sometimes the background is white and you cant see the text
Gulsvi
@gulsvi
Feb 06 2018 18:40
Many people use an array of good background + text color combinations and pick a random one from the array
In your example, you can check if hex = #ffffff
if it does, generate another value
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 18:43
there are a range of colours, like dirty whites and very light pinks that also make it difficult to see, is there a way of excluding all of them? like making sure the white value is above a certain level?
sounds a long shot i know
Gulsvi
@gulsvi
Feb 06 2018 18:44
It's definitely possible, but gets more complicated.
Stephen James
@sjames1958gm
Feb 06 2018 18:44
@Boris-the-Llama You could do random 0-255 for each piece. But excluding certain colors, difficult?
Gulsvi
@gulsvi
Feb 06 2018 18:44
You could convert the hex to a HSL color - I think lots of people do that to ensure the right amount of contrast between two colors
It's much, much easier to define an array of 20 or so color combinations though and just pick those combos at random
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 18:46
yeah I think i am going to just do an array, thanks @gulsvi
CamperBot
@camperbot
Feb 06 2018 18:46
boris-the-llama sends brownie points to @gulsvi :sparkles: :thumbsup: :sparkles:
:star2: 2588 | @gulsvi |http://www.freecodecamp.org/gulsvi
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 18:46
@sjames1958gm are you a chelsea fan? you have the chelsea badge as your avatar
Stephen James
@sjames1958gm
Feb 06 2018 18:47
@Boris-the-Llama I am a very sad chelsea fan :(
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 18:47
did you know they lost last night? they didn't play well @sjames1958gm
Stephen James
@sjames1958gm
Feb 06 2018 18:48
@Boris-the-Llama Yes, I was at home, had to turn it off
@Boris-the-Llama Thanks for the reminder :( lol
CamperBot
@camperbot
Feb 06 2018 18:48
sjames1958gm sends brownie points to @boris-the-llama :sparkles: :thumbsup: :sparkles:
:cookie: 263 | @boris-the-llama |http://www.freecodecamp.org/boris-the-llama
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 18:48
@Boris-the-Llama
Specify range for random numbers. Exclude those that are close to white
var hex = Math.floor(Math.random() * (0xEEEEEE - 0x000000));
return "#" + ("000000" + hex.toString(16)).substr(-6);
the - 0x000000 part is unnecessary here, but you could replace that with other color offset
Gulsvi
@gulsvi
Feb 06 2018 18:50
That still gives cream colors, light pinks, etc
Dany Din
@danydin
Feb 06 2018 18:50
hey can i put bootstrap icon as rel link?
Gulsvi
@gulsvi
Feb 06 2018 18:51
@danydin Yes, there are instructions for that on the main page of the bootstrap docs
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
Dany Din
@danydin
Feb 06 2018 18:52
@gulsvi i'm talking about rel="icon" mate
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 18:52
@SweetCodingInc what is this bit doing? i dont really get what it was doing in the first place, i copied from something else i saw. is the EEEEEE bit excluding the white?
Gulsvi
@gulsvi
Feb 06 2018 18:53
@danydin sorry misunderstood - I think rel="icon" is just for favicons. You could use a bootstrap icon, or any icon you want for that.
Dany Din
@danydin
Feb 06 2018 18:54
so i need to download the icon first and then href it?
Gulsvi
@gulsvi
Feb 06 2018 18:54
or link to it, yes
Look at how they do it on getbootstrap.com:
<link rel="apple-touch-icon" href="/assets/img/favicons/apple-touch-icon.png" sizes="180x180">
<link rel="icon" href="/assets/img/favicons/favicon-32x32.png" sizes="32x32" type="image/png">
<link rel="icon" href="/assets/img/favicons/favicon-16x16.png" sizes="16x16" type="image/png">
<link rel="manifest" href="/assets/img/favicons/manifest.json">
<link rel="mask-icon" href="/assets/img/favicons/safari-pinned-tab.svg" color="#563d7c">
<link rel="icon" href="/favicon.ico">
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 18:55
@Boris-the-Llama color black has hexcode 000000 and white has ffffff
Dany Din
@danydin
Feb 06 2018 18:55
@gulsvi thanks!! how can i find the 'badge' one?
CamperBot
@camperbot
Feb 06 2018 18:55
danydin sends brownie points to @gulsvi :sparkles: :thumbsup: :sparkles:
:star2: 2589 | @gulsvi |http://www.freecodecamp.org/gulsvi
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 18:55
to represent hexadecimal number in js you add 0x before the number
is if your text color is light, you want dark backgrounds
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 18:56
here is a nice chart that represents colors with their hexadecimal number
Look up this part RGB color codes chart at https://www.rapidtables.com/web/color/RGB_Color.html
Gulsvi
@gulsvi
Feb 06 2018 18:57
@danydin I thought you meant the actual bootstrap icon - the "B" :)
Eric Weiss
@eweiss17
Feb 06 2018 18:57
why not just loop through a predetermined array of approved colors if what color being displayed is a big deal
Dany Din
@danydin
Feb 06 2018 18:57
check for the one called badge but even in the source it just says that it uses from the class
ah lol :DD
Gulsvi
@gulsvi
Feb 06 2018 18:57
That's someone else's custom icons, don't know off the top of my head
Dany Din
@danydin
Feb 06 2018 18:57
i found them if it's interesting you:
http://glyphicons.com/
Eric Weiss
@eweiss17
Feb 06 2018 18:58
google also has icons that are nice https://material.io/icons/
Gulsvi
@gulsvi
Feb 06 2018 18:58
@danydin You'll need a .png file or a .ico file to do it
Those icons are more like fonts than actual image files
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 18:59
@SweetCodingInc thanks. what does the EEEEE - 00000 do?
CamperBot
@camperbot
Feb 06 2018 18:59
boris-the-llama sends brownie points to @sweetcodinginc :sparkles: :thumbsup: :sparkles:
:cookie: 248 | @sweetcodinginc |http://www.freecodecamp.org/sweetcodinginc
Dany Din
@danydin
Feb 06 2018 18:59
@eweiss17 thanks!
yes they let you download the free pckage
Gulsvi
@gulsvi
Feb 06 2018 18:59
take a screenshot, crop it in your favorite photo editor and make it into an image. Then host that image somewhere and link to it.
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 18:59
@eweiss17 what if people get upset there is only 20 colors, and not thousands?!
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 19:00
@Boris-the-Llama it's meaningless in this context. It subtracts 0 from EEE (which in decimal is 3822)
Eric Weiss
@eweiss17
Feb 06 2018 19:01
I'd rather have 20 colors that look good than thousands that may not
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 19:02
@SweetCodingInc ok cool
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 19:02
but say you want to generate random color between green and orange you'd do 0xFF3333 - 0x009900
color codes picked up from the chart I shared the link for
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 19:02
@eweiss17 what 20 colors would you have that look good with white text?
Eric Weiss
@eweiss17
Feb 06 2018 19:04
I don't know, you can find color helpers online for sure
Gulsvi
@gulsvi
Feb 06 2018 19:04
@Boris-the-Llama One of my favorite color combo generators: https://palettable.io
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 19:04
@eweiss17 i was just being lazy and see if you could give me some hex or rgbs of colors
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 19:05
@gulsvi they're using the random color generator as well :laughing:
Gulsvi
@gulsvi
Feb 06 2018 19:05
I thought they were using an API
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 19:06
@gulsvi API or not, it's still random hexadecimal number generation...
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 19:06
@gulsvi thanks, ill have a butchers
CamperBot
@camperbot
Feb 06 2018 19:06
boris-the-llama sends brownie points to @gulsvi :sparkles: :thumbsup: :sparkles:
api offline
Gulsvi
@gulsvi
Feb 06 2018 19:07
@SweetCodingInc They choose complementary colors though, at least they use to. A little more complicated than choosing a random color.
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 19:07
how does one emoji?
Gulsvi
@gulsvi
Feb 06 2018 19:08
semi colon: :
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 19:08
:shipit:
is there a dancing emoji?
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 19:08
@gulsvi yes... in range
based on what you like
abx2dx\int_{a}^{b} x^2 dx
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 19:09
well i do like dancing, so i have one?
:dancers:
oh yes look!
Eric Weiss
@eweiss17
Feb 06 2018 19:11
nice llol
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 19:13
does anyone know where i can get more emojis? i would like one of a crocodile wearing a suit, though just a tie would do? can only find a plain crocodile
Gulsvi
@gulsvi
Feb 06 2018 19:13
not sure what an indefinite integral has to do with color palettes, but I'm curious to know more
I believe this is the API they're using: http://www.colourlovers.com/api
Sweet Coding :)
@SweetCodingInc
Feb 06 2018 19:14
@gulsvi I meant to paste that in the other room
Eric Weiss
@eweiss17
Feb 06 2018 19:20
helping someone with calc homework lol
Gulsvi
@gulsvi
Feb 06 2018 19:22
I failed my last semester of physics because of integrals lol
algebra, geometry, trig - no problem. calculus...ugh
Eric Weiss
@eweiss17
Feb 06 2018 19:24
well yeah, calculus is the most advanced of those
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 19:29
so for putting good colors in an array, what values do i need? can i have an array of color names, or do i need hexs/rgbs?
Gulsvi
@gulsvi
Feb 06 2018 19:31
@Boris-the-Llama You can use names if you like the color - for specific shades of those colors, you'll need to use hex/rgb
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 19:32
@gulsvi cool thanks, ill just use some color names
CamperBot
@camperbot
Feb 06 2018 19:32
boris-the-llama sends brownie points to @gulsvi :sparkles: :thumbsup: :sparkles:
api offline
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 19:32
why is the api offline? does that mean no cookies for people?
:cookie:
Gulsvi
@gulsvi
Feb 06 2018 19:33
cbot status
CamperBot
@camperbot
Feb 06 2018 19:33
All bot systems are go!
botVersion: 0.0.12
env: prod
botname: camperbot
Gulsvi
@gulsvi
Feb 06 2018 19:33
thanks @gulsvi!
CamperBot
@camperbot
Feb 06 2018 19:33
sorry gulsvi, you can't send brownie points to yourself! :sparkles: :sparkles:
Gulsvi
@gulsvi
Feb 06 2018 19:33
allyourbase
CamperBot
@camperbot
Feb 06 2018 19:33
all your base
Gulsvi
@gulsvi
Feb 06 2018 19:34
Seems to be working, not sure what's up
Oh, I know, it's because you already gave me cookies - there's a waiting period between cookie giving
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 19:35
ok @gulsvi . did you know you have followers?
Gulsvi
@gulsvi
Feb 06 2018 19:35
On Github? I have 0 repositories, don't know what people are following :p
If you need a follower though, I'm happy to oblige with #teamfollowback
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 19:37
but what do followers do? i dont know if i could live up to their expectations to do stuff
Gulsvi
@gulsvi
Feb 06 2018 19:37
I'm not sure haha
I don't follow anyone apparently, but thanks for pointing that out. Had never looked
Eric Weiss
@eweiss17
Feb 06 2018 19:39
it just tells you when they make a commit when you follow someone
or create a new repo, pretty much anything they do
Markus Kiili
@Masd925
Feb 06 2018 19:40
@Boris-the-Llama Don't worry. I have 49 and don't know what they are or do.
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 19:40
lets hope they dont start stalking, i heard about an obsessed stalker on the news
Gulsvi
@gulsvi
Feb 06 2018 19:41
wow, what are the odds. 49 followers 0 following just like me
Markus Kiili
@Masd925
Feb 06 2018 19:41
@gulsvi :sparkles:
Gulsvi
@gulsvi
Feb 06 2018 19:41
at least your followers have something to look at @Masd925 :laughing:
Fernando
@lestairon
Feb 06 2018 19:42
Is codepen bugged?
Gulsvi
@gulsvi
Feb 06 2018 19:42
not for me
Eric Weiss
@eweiss17
Feb 06 2018 19:42
yep the first step to stalking is following on github
Fernando
@lestairon
Feb 06 2018 19:42
My pen looks so different
I didn't even changed anything
wtf
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 19:42
@lestairon bugged? like someone listening in on a microphone?
Eric Weiss
@eweiss17
Feb 06 2018 19:43
could have been an update or something
Gulsvi
@gulsvi
Feb 06 2018 19:43
Or bugged, like you copy/pasted everything from your desktop into codepen and it doesn't look the same?
Fernando
@lestairon
Feb 06 2018 19:44
No
I did everything in codepen
Left for 9 days
And now it looks so bad
Eric Weiss
@eweiss17
Feb 06 2018 19:45
link it
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 19:49
what has changed fernando?
cjlynch12
@cjlynch12
Feb 06 2018 19:51
looks like just some CSS issues @lestairon, api is working correctly
Fernando
@lestairon
Feb 06 2018 19:51
The button doesn't look the same and the temperature is off
Yeah
Gulsvi
@gulsvi
Feb 06 2018 19:52
@lestairon Add bootstrap to your CSS settings
Remove the weather API from your JS Settings
Then everything looks fine - not sure why those settings got changed though. Very strange.
Eric Weiss
@eweiss17
Feb 06 2018 19:54
cool purple background
Fernando
@lestairon
Feb 06 2018 19:56
I didn't do it, but yeah, looks pretty cool ^^
@gulsvi Thanks, that fixed it
CamperBot
@camperbot
Feb 06 2018 19:56
lestairon sends brownie points to @gulsvi :sparkles: :thumbsup: :sparkles:
:star2: 2590 | @gulsvi |http://www.freecodecamp.org/gulsvi
Gulsvi
@gulsvi
Feb 06 2018 19:56
Cool, happy to help
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 19:57
@lestairon who did do it? is that a pokemon in your avatar?
I guess the background is from there ^
Gulsvi
@gulsvi
Feb 06 2018 19:59
Very cool, another one! :)
Fernando
@lestairon
Feb 06 2018 19:59
@Boris-the-Llama Yeah, it is a Pokemon
Eric Weiss
@eweiss17
Feb 06 2018 20:01
all my project backgrounds are gray, maybe i'll use those gradients instead
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 20:01
who would like to have a butchers at my random quote machine?
nobody? :cry:
Fernando
@lestairon
Feb 06 2018 20:04
Let me see
here you go!!!
Gulsvi
@gulsvi
Feb 06 2018 20:06
Random comma gets added to tweets: We must become the change we want to see. , ~ Mahatma Gandhi
The twitter icon color is hard to see - I suggest using the official twitter blue color
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 20:09
i thought i was using the official twitter color?
Gulsvi
@gulsvi
Feb 06 2018 20:09
No, you're using a really, really light blue
I can barely see it on my monitor, maybe easier to see on other monitors
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 20:10
oh, i thought that was the proper color, ill change it now
Eric Weiss
@eweiss17
Feb 06 2018 20:10
hit those buttons with some cursor: pointer, you know what i mean
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 20:10
and i got rid of the quote on the tweet
@eweiss17 ok thanks, will do
CamperBot
@camperbot
Feb 06 2018 20:11
boris-the-llama sends brownie points to @eweiss17 :sparkles: :thumbsup: :sparkles:
:cookie: 606 | @eweiss17 |http://www.freecodecamp.org/eweiss17
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 20:11
@gulsvi can i give u cookie yet?
Matej Bošnjak
@mbosnjak01
Feb 06 2018 20:11
@Boris-the-Llama :+1:
Eric Weiss
@eweiss17
Feb 06 2018 20:11
is your color transitioning between each or just directly changing
Gulsvi
@gulsvi
Feb 06 2018 20:11

@Boris-the-Llama Also, this JS is confusing:

if (!author == "") {
  $(".author").html("~ " + author);
} else {
  $(".author").html("~ " + "Unknown");
}

Do this instead:

if (author !== "") {
  $(".author").html("~ " + author);
} else {
  $(".author").html("~ " + "Unknown");
}
Fernando
@lestairon
Feb 06 2018 20:12
@Boris-the-Llama There's a problem with your code
Try to share a quote with ";" and see what happens
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 20:12
:crying_cat_face: @lestairon what is it?
Eric Weiss
@eweiss17
Feb 06 2018 20:13
You could just omit that code completely if no author, up to you i guess
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 20:13
oh no! why it do that?
Fernando
@lestairon
Feb 06 2018 20:13

Change

window.open("https://twitter.com/intent/tweet?text="+ quotes + ", ~ " + author

for

window.open("https://twitter.com/intent/tweet?text="+ encodeURIComponent(quotes) + ", ~ " + author
Gulsvi
@gulsvi
Feb 06 2018 20:14
I would just do this:
      author = data.quoteAuthor || "Unknown";
      $(".author").html("~ " + author)
Fernando
@lestairon
Feb 06 2018 20:16
I had the same problem with semicolons
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 20:18
ok thanks ppl, @lestairon @gulsvi @eweiss17
CamperBot
@camperbot
Feb 06 2018 20:18
boris-the-llama sends brownie points to @lestairon and @gulsvi and @eweiss17 :sparkles: :thumbsup: :sparkles:
api offline
:star2: 2591 | @gulsvi |http://www.freecodecamp.org/gulsvi
:cookie: 267 | @lestairon |http://www.freecodecamp.org/lestairon
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 20:18
what about colors? was it a visual delight?
Gulsvi
@gulsvi
Feb 06 2018 20:22
Delightful for sure
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 20:23
@gulsvi im glad it was pleasing on the eye
Onome Sotu
@onomesotu
Feb 06 2018 20:28
RegExp is so fun
and come to think I was so freaking scared of it all these time :)
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 20:31
how would one make sure that the background changes each time, ie that the same background is not picked by the random method
im guessing an if statement, but when i do if colors[randomCol] == colors[randomCol] it breaks the code?
Fernando
@lestairon
Feb 06 2018 20:42
Hm
Maybe having a variable that stores the previous color, if the new random color is the same one, run the random method again
Idk, that's what i'd do
Boris-the-Llama
@Boris-the-Llama
Feb 06 2018 20:45
how would i go about storing the previous color in a variable?
Ken Haduch
@khaduch
Feb 06 2018 21:05
@Boris-the-Llama - without seeing the code, I would say that you declare a variable somewhere that will be accessible to your code, but only changed by the code that is selecting a new color. You can call it prevColor and store the index of the color that was last used with randomCol to set the color. Then you would need a loop that would generate a random number for the new randomCol and compare it to the prevColor and keep looping until you selected something different. Perhaps put a safety net counter in there to prevent infinite loops? But that would be the idea that I would try.
Gulsvi
@gulsvi
Feb 06 2018 21:23
@Boris-the-Llama Use RGB colors instead of color names and do:
    if ($("body").css("backgroundColor") == colors[randomCol]) {
      getRandomColor();
    } else {
      return colors[randomCol];
    }
Ask jQuery what the current background color is - you'll get a RGB value back. If it's the same one, call your function again and get a new random color to compare with again, else return the new color.
@onomesotu I have never heard anyone say that Regex is fun :laughing:
Fernando
@lestairon
Feb 06 2018 22:08
Same
disjfa
@disjfa
Feb 06 2018 22:29
Bbbbbbbut regex is awesome
Fernando
@lestairon
Feb 06 2018 22:38
I always have a bad time with regx haha
Maybe it's because i'm learning
Fernando
@lestairon
Feb 06 2018 22:46
How can i use icons from an api?
I'm trying to use these icons on my page, but i don't know how exactly
http://erikflowers.github.io/weather-icons/

I tried using

<ul>
  <li> </li>
</ul>

But i think i'm doing something wrong

Lee
@LeeConnelly12
Feb 06 2018 22:52
@lestairon The tells you to use the icons like this
<i class="wi wi-night-sleet"></i>
Ken Haduch
@khaduch
Feb 06 2018 23:05
@lestairon - it's a great idea to use some of the sites that they recommend in the lessons, such as regex101.com or regexr.com or regexone.com - I don't know if one is better than another, but they walk you through regular expression examples and have a sandbox environment that you can use with the lessons or when you are developing your own expressions. Neat stuff!
RobertGlick
@RobertGlick
Feb 06 2018 23:17
@lestairon it needs to be <ul> not <u1> l is a letter not 1 the number
@lestairon for un listed
Gulsvi
@gulsvi
Feb 06 2018 23:21
@RobertGlick ul stands for Unordered List :)
<ol> = ordered list (1,2,3)
RobertGlick
@RobertGlick
Feb 06 2018 23:22
@gulsvi thanks :smile:
CamperBot
@camperbot
Feb 06 2018 23:22
robertglick sends brownie points to @gulsvi :sparkles: :thumbsup: :sparkles:
:star2: 2592 | @gulsvi |http://www.freecodecamp.org/gulsvi
Gulsvi
@gulsvi
Feb 06 2018 23:22
But, that's just the font, it is a ul the way they have it above, not u1
RobertGlick
@RobertGlick
Feb 06 2018 23:23
ah
Gulsvi
@gulsvi
Feb 06 2018 23:23
I had to copy/paste to be sure lol