These are chat archives for FreeCodeCamp/HelpJavaScript

19th
Apr 2018
Keggatron
@Keggatron
Apr 19 2018 01:02
Has anyone ever encountered an issue while trying to install packages from within their create-react-app
I'm getting an issue where Iwasn't able to start my app because there error said it could not find module 'node_modules'
so I removed the folder and tried npm install again
which didn't work
then I started a new create-react-app from the directory and tried again in there to no avail
Greg Duncan
@GregatGit
Apr 19 2018 01:23
@Keggatron make sure you are in the correct folder in the cli
anthonygallina1
@anthonygallina1
Apr 19 2018 01:25
yes and try node -v from terminal or command prompt Depending on your OS.
Greg Duncan
@GregatGit
Apr 19 2018 01:35
@Keggatron Whatever mistake you are making once you figure it out you'll kick yourself and probably not make it again
anthonygallina1
@anthonygallina1
Apr 19 2018 01:36
@GregatGit I dont see nvm or node js in the package here. https://github.com/facebook/create-react-app/blob/next/package.json
Greg Duncan
@GregatGit
Apr 19 2018 01:38
the node modules folder is created and all those packages go in them
anthonygallina1
@anthonygallina1
Apr 19 2018 01:38
Probably some thing simple. I believe I install npx or nvm or node js first.
There could be a good you tube vid on it some where
Keggatron
@Keggatron
Apr 19 2018 01:49
@GregatGit I reinstalled a new create-react-app in my directory with the new node_modules folder and it worked
not sure what was the issue with the other CRA node_modules folder
Greg Duncan
@GregatGit
Apr 19 2018 01:50
@Keggatron :+1: :smile:
anthonygallina1
@anthonygallina1
Apr 19 2018 01:50
:thumbsup:
;)
AbrisM
@AbrisM
Apr 19 2018 02:10
@JLuboff You mean the hasNext or hasNextInt, hasNextLine, etc
@tiagocorreiaalmeida I'm going to be taking sever-side maintance. We'll probably be doing sql :smile:
Nazar
@IsaakNazar
Apr 19 2018 07:20
:wave:
Josh Queen
@Kohota107
Apr 19 2018 12:44
Hey guys, quick question
What's the easiest way of splicing an array with a value based on the previous index of that array
For example, I have a function passing two numbers in an array as an argument
let's say 5 and 10
I want an array to be returned with [5, 6, 7, 8, 9, 10]
I've tried it with a for loop which then splices an incremental value, but no luck :(
Aditya
@ezioda004
Apr 19 2018 12:52
@Kohota107 I dont think I understood your question correctly, you want to return an array with the range of the numbers b/w passed as an argument?
Marianissimus
@Marianissimus
Apr 19 2018 12:52
so slice before 5 and after 10? @Kohota107
Josh Queen
@Kohota107
Apr 19 2018 12:53
Correct
So something like
function getNumbers(a,b) {

}

getNumbers([1,5])
And it would return
Marianissimus
@Marianissimus
Apr 19 2018 12:55
and it will get you the numbers from 1 to 5? what is the array?
Josh Queen
@Kohota107
Apr 19 2018 12:55
[1,2,3,4,5]
Aditya
@ezioda004
Apr 19 2018 12:55
@Kohota107 What have you attempted so far?
Marianissimus
@Marianissimus
Apr 19 2018 12:55
well, what is the starting array?
Josh Queen
@Kohota107
Apr 19 2018 12:56
the starting array is [1,5]
Marianissimus
@Marianissimus
Apr 19 2018 12:56
you want to generate it? it's still not clear. give us the starting code and the final output
that only has two elements. you want to generate the elements between them?
Aditya
@ezioda004
Apr 19 2018 12:57
Also, btw b is undefined since you're passing only a as an array.
Josh Queen
@Kohota107
Apr 19 2018 12:57
Sorry, I was just trying to simplify the explanation
But basically, I'm passing two numbers, converting them to an array, and then trying to splice in the series of numbers between
And then return the output array
Marianissimus
@Marianissimus
Apr 19 2018 12:58
that's not splicing
Aditya
@ezioda004
Apr 19 2018 12:58
Yeah, if you could show your attempted code, it'd be easier to help out.
Stephen James
@sjames1958gm
Apr 19 2018 12:59
@Kohota107 Converting to an array then trying to insert the in between numbers seems like a complex way to do it
Just create and empty array and add all the numbers from a to b inclusive
Marianissimus
@Marianissimus
Apr 19 2018 12:59
so, if you start with the array[1,5] and want to get the output [1,2,3,4,5] - that means loop through the original array and add to it
Stephen James
@sjames1958gm
Apr 19 2018 13:00
@Kohota107 So you start with just two numbers, not an array?
Josh Queen
@Kohota107
Apr 19 2018 13:01
@sjames1958gm Yeah, I haven't even thought of that
always over complicating things -_-
Stephen James
@sjames1958gm
Apr 19 2018 13:02
@Kohota107 You are not alone there . :)
Marianissimus
@Marianissimus
Apr 19 2018 13:02
second this @sjames1958gm
he's right - create a new array; otherwise you have to split the original array and add numbers before the last element... overcomplicating once again
because I'm too lazy to do my own work, here's @sjames1958gm solution:
function completeArr(arr){
var finalArr = []
 for (var i=arr[0]; i<=arr[1]; i++){
  finalArr.push(i);
 }
 return finalArr;
}
Josh Queen
@Kohota107
Apr 19 2018 13:07
perfect, thanks
Stephen James
@sjames1958gm
Apr 19 2018 13:08
If you are only getting two numbers, then:
function completeArr(a, b){
  var finalArr = []
   for (var i=a; i<= b; i++){
     finalArr.push(i);
   }
 return finalArr;
}
Nazar
@IsaakNazar
Apr 19 2018 13:09
@sjames1958gm hello Stephen :wave:
Stephen James
@sjames1958gm
Apr 19 2018 13:09
@IsaakNazar :wave:
Nazar
@IsaakNazar
Apr 19 2018 13:11
I've finished pomodoro project, everything works as expected, but
on mobile phones the values of sliders are not updating
Rajat
@rajataudichya
Apr 19 2018 13:17
hello
```js

function mutation(arr) {

  var arg2 = arr[1].split('');

  var arg1 = arr[0];



 for (var i = 0; i < arg2.length; i++){

   var fArr =  arg1.indexOf(arg2[i]);

    if (fArr < 0 ){

      return false;

    }


    else {

      return true;
    }


      }



} 

mutation(["hello", "hyo"]);
I am stuck in this mutation challenge
What I need to do is to return false if any of the words in arg[1] is not in arg[0] so by using split and running a loop I will be getting -1 if the word is not in the first arg[1] and I am getting -1 but somehow it is not accepting that statement
Koee toh madad kardo bhai ki
Blauelf
@Blauelf
Apr 19 2018 13:21

No need to split. But what does it tell you if a letter is found in the other string? It doesn't tell you much. You may return true only if all letters can be found, so after the loop.

And you need to ignore case (e.g. by lower- or uppercasing the strings first)

Dhaval Vira
@dhavalveera
Apr 19 2018 13:22
Rajat your Hindi will not understand by others & also check the Time Zones of Members
Rajat
@rajataudichya
Apr 19 2018 13:22
@dhavalveera I wanted to find someone who understands Hindi :)
@Blauelf Didn't got you
I believe indexOf() lets me know the position of a letter and if the letter does not exist it outputs -1
Alex
@alexandrupintilei
Apr 19 2018 13:44
line 70 // why IDE sugest me to acces prop as obj? since is an array of objs?
image.png
Blauelf
@Blauelf
Apr 19 2018 13:48
@rajataudichya That's right, but your function needs to return false if any character cannot be found, but return true only if all characters can be found. That means return true; and return false; need to go to different places.
sabahatullah
@sabahatullah
Apr 19 2018 13:59
guys, what number would match this regex \b0[689][0-9]{8}\b
Blauelf
@Blauelf
Apr 19 2018 14:00
Anything with ten digits starting with 0 and a digit of 6, 8, or 9. Like for example 0987654321.
Yes, that's just once backwards over the number row ;)
Nate Mallison
@NJM8
Apr 19 2018 14:03
@JLuboff You on yet?
sabahatullah
@sabahatullah
Apr 19 2018 14:14
@Blauelf many thanks
CamperBot
@camperbot
Apr 19 2018 14:14
sabahatullah sends brownie points to @blauelf :sparkles: :thumbsup: :sparkles:
:star2: 4692 | @blauelf |http://www.freecodecamp.org/blauelf
Nate Mallison
@NJM8
Apr 19 2018 14:46
@cmccormack You do not need to check for the environment with dotenv.load()
fails silently so it's working fine in production with just always loading it
Christopher McCormack
@cmccormack
Apr 19 2018 14:48
@NJM8 that's cool man glad you were able to test it successfully
sabahatullah
@sabahatullah
Apr 19 2018 14:49
why this works only with this quote audio and not with single/double quote
document.querySelector(audio[data-key="${e.keyCode}"])
Nate Mallison
@NJM8
Apr 19 2018 14:49
It was a struggle today to get things on Heroku, uploaded everything, fails, oh yeah need a Procfile, fails, oh yeah need my config vars on heroku, fails, oh yeah let's add mLabs so it has a db
struggling
@sabahatullah That is a string literal
You want backticks for string template
document.querySelector(audio[data-key=`${e.keyCode}`])
Christopher McCormack
@cmccormack
Apr 19 2018 14:54
looks good!
uses google?
sabahatullah
@sabahatullah
Apr 19 2018 14:57
@NJM8 thanks
CamperBot
@camperbot
Apr 19 2018 14:57
sabahatullah sends brownie points to @njm8 :sparkles: :thumbsup: :sparkles:
:cookie: 417 | @njm8 |http://www.freecodecamp.org/njm8
Nate Mallison
@NJM8
Apr 19 2018 14:57
yes, npm package google-images and a custom search engine through google apis
sure thing!
Christopher McCormack
@cmccormack
Apr 19 2018 15:01
I love there are apis for pretty much everything
sabahatullah
@sabahatullah
Apr 19 2018 15:01
@NJM8 is the template concept new? with backticks
Nate Mallison
@NJM8
Apr 19 2018 15:01
while I was loading up stuff for the imageSearch app I noticed one of my other apps was live meaning someone was using it, indeed there was a new user in the DB, what's weird is it isn't on my portfolio and I don't think I've really told anyone about it
@sabahatullah ES6 I think
Christopher McCormack
@cmccormack
Apr 19 2018 15:03
@NJM8 is it on glitch?
and github?
Nate Mallison
@NJM8
Apr 19 2018 15:04
sorry they are called template literals, used to be template strings, I think they used to have some support but formalized in ES6 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals
@cmccormack My github and Heroku
Christopher McCormack
@cmccormack
Apr 19 2018 15:04
is your heroku linked from github?
you must have shared it at least once as well right?
Nate Mallison
@NJM8
Apr 19 2018 15:04
I don't think you would really know how to get to the heroku site from github, well I guess it has the same name so if you searched for it it may show up
ah my github does say it's on heroku so I'm sure someone could figure it out, just interesting
I think I showed it to some people at home but not here or anything
If I did it was 2 months ago
not an FCC project
Christopher McCormack
@cmccormack
Apr 19 2018 15:06
I had the same thing happen with my voting app, I only had it in glitch and github
people may look at your github from here though
Nate Mallison
@NJM8
Apr 19 2018 15:07
we have users now, better start monetizing! haha
ads, ads everywhere
Christopher McCormack
@cmccormack
Apr 19 2018 15:07
haha and now we have no users again
Nate Mallison
@NJM8
Apr 19 2018 15:13
is body-parsers job to take the url parameters and decode them and stick them in req.params?
Jason Luboff
@JLuboff
Apr 19 2018 15:13
@NJM8 I am now
Nate Mallison
@NJM8
Apr 19 2018 15:14
I'm still confused at exactly what it does, but I know I needed it on imageSearch to help get optional url parameters easily
Christopher McCormack
@cmccormack
Apr 19 2018 15:14
@JLuboff yo
Nate Mallison
@NJM8
Apr 19 2018 15:14
@JLuboff Your too late
Christopher McCormack
@cmccormack
Apr 19 2018 15:14
@NJM8 req.body I believe
Jason Luboff
@JLuboff
Apr 19 2018 15:14
No, body-parsers job is to get form data
Nate Mallison
@NJM8
Apr 19 2018 15:14
lol
Jason Luboff
@JLuboff
Apr 19 2018 15:14
@cmccormack What up
@NJM8 req.body is not populated unless you have middleware such as body-parser or multer
Nate Mallison
@NJM8
Apr 19 2018 15:15
ahh ok, does it also help with optional url parameters?
Jason Luboff
@JLuboff
Apr 19 2018 15:15
No
Christopher McCormack
@cmccormack
Apr 19 2018 15:15
I think tha'ts built in no?
Jason Luboff
@JLuboff
Apr 19 2018 15:15
You just use req.param.paramName if its a parameter or req.query.queryParamName if its a query parameter
Nate Mallison
@NJM8
Apr 19 2018 15:15
like req.query.offset if someone includes ?offset=3 at the end of the url
got it
Jason Luboff
@JLuboff
Apr 19 2018 15:15
@cmccormack req.param and req.query are built in (to express at least)
Nate Mallison
@NJM8
Apr 19 2018 15:16
cool thanks
Jason Luboff
@JLuboff
Apr 19 2018 15:16
@NJM8 Correct, so req.query.offset would be 3
Nate Mallison
@NJM8
Apr 19 2018 15:17
before I needed help with understanding what a mongoose query returns as I couldn't modify the obj properties, but learned its a mongoose document obj so it has methods attached and I guess is immutable. not clear on how you can change it, but I used .lean() to return a regular obj
I guess you don't use mongoose much though?
Jason Luboff
@JLuboff
Apr 19 2018 15:18
No, I don't sorry.
Christopher McCormack
@cmccormack
Apr 19 2018 15:18
.save() isnt working?
Nate Mallison
@NJM8
Apr 19 2018 15:19
no I wanted to add and remove properties on the returned object, like remove the _id and change a date string to something more readable, but any changes made did not take effect.
Christopher McCormack
@cmccormack
Apr 19 2018 15:19
hmm did you get an error?
it could be that you didn't provide a callback so it didn't do anything, mongoose does that for several methods
Nate Mallison
@NJM8
Apr 19 2018 15:20
nope just didn't do anything, but adding .lean() to the query returned a normal JS obj that I could change
Christopher McCormack
@cmccormack
Apr 19 2018 15:20
it needs to invoke execute using some means, whether .exec or the callback passed
are you using a model?
Nate Mallison
@NJM8
Apr 19 2018 15:24
it's not that, it's that the query returns a Mongoose document, not a normal JS object, so if you want to modify it you have to use it's methods or change it to a normal JS object
Christopher McCormack
@cmccormack
Apr 19 2018 15:24
yes, use the methods...
Nate Mallison
@NJM8
Apr 19 2018 15:24
  return db.Image.find().sort({'updatedAt': -1}).limit(10)
    .select({ searchQuery: 1, createdAt: 1, _id:0 }).lean()
    .exec().then(data => {
      // needed to map over data and make new object from query result, query result is a mongoose doc obj so it cannot be modified, adding .lean() returns a simple JS obj that can be modified.
      // data = data.map(item => {
      //   const date = new Date(item.createdAt);
      //   return ({searchQuery: item.searchQuery, searchDate: `${date.toDateString()} ${date.toTimeString()}`});
      // });
      data.forEach(item => {
        const date = new Date(item.createdAt);
        item.searchDate = `${date.toDateString()} ${date.toTimeString()}`;
        delete item.createdAt;
      })
      return res.json(data);
Christopher McCormack
@cmccormack
Apr 19 2018 15:24
I guess I'm not following why you would need to convert it
Nate Mallison
@NJM8
Apr 19 2018 15:25
I just wanted to make the results of the query more readable
searchQuery    "coffee"
createdAt    "2018-04-19T14:15:46.431Z"
Changed to:
searchQuery    "coffee"
searchDate    "Thu Apr 19 2018 10:15:46 GMT-0400 (EDT)"
it's for the results of the api/latest route on the imageSearch app
Christopher McCormack
@cmccormack
Apr 19 2018 15:26
oh so not saving to db?
Nate Mallison
@NJM8
Apr 19 2018 15:26
correct
just showing results
the image search app has two routes, one to serve the JSON of the search and one to display the last 10 searches
Christopher McCormack
@cmccormack
Apr 19 2018 15:27
oh then yeah .lean or .toObject should be good, sorry
Nate Mallison
@NJM8
Apr 19 2018 15:28
rather than have two collections and push to both, one for a search and one for the history, I just pull the last ten searches
I guess I didn't even need to store my search results
oops
Jason Luboff
@JLuboff
Apr 19 2018 15:29
I think you need to store all searches don't you? Becuase you have the offset option (its been a while since I've done that project)\
Nate Mallison
@NJM8
Apr 19 2018 15:29
I probably could've done it on the model too, just to store the data I wanted.
Here are the specific user stories you should implement for this project:
User Story: I can get the image URLs, alt text and page urls for a set of images relating to a given search string.
User Story: I can paginate through the responses by adding a ?offset=2 parameter to the URL.
User Story: I can get a list of the most recently submitted search strings.
for paginating I just do a new search and offset with the search
Jason Luboff
@JLuboff
Apr 19 2018 15:30
Ya so you still need to store the search's
Nate Mallison
@NJM8
Apr 19 2018 15:30
I never even thought about searching the DB for an existing search to display those results and paginating from there
Christopher McCormack
@cmccormack
Apr 19 2018 15:30
man I just did that a few months ago and have no idea what my code does haha https://github.com/cmccormack/image-search/blob/master/app/api.js
Nate Mallison
@NJM8
Apr 19 2018 15:30
I just always do a new search
As far as DB they only specify getting a list of the most recent search string
I wonder if the beta has this same project, usually the user stories are much clearer and flushed out
looks like you used the same module
Christopher McCormack
@cmccormack
Apr 19 2018 15:35
I didn't use mongoose on that one though, probably wasn't needed
Nate Mallison
@NJM8
Apr 19 2018 15:40
I have done so many projects with mongoose, I'm not really sure what is mongoose and what isn't haha, I should do some just mongo
Christopher McCormack
@cmccormack
Apr 19 2018 15:41
it's really powerful for Models/Schema
Nate Mallison
@NJM8
Apr 19 2018 15:41
yup, now that I review the material I learned from I see why it exists
Jason Luboff
@JLuboff
Apr 19 2018 15:41
I sort of wish I knew mongoose...but I also despise it...so.. theres that :joy:
But yes, mongoose is good due to the ORM nature of it
Christopher McCormack
@cmccormack
Apr 19 2018 15:42
read through this page and see how it uses models and schema and populate, it's super simple but pretty powerful http://mongoosejs.com/docs/populate.html
Nate Mallison
@NJM8
Apr 19 2018 15:42
It's hard when you have to learn 4 technologies at once to build one thing, you forget which is which
especially when it is all just JS
mongo, express, node, and mongoose all in one go.
I saw an SO question yesterday where someone was asking why console.log in his routes aren't showing up in his browser console, talk about confusion, haha
Christopher McCormack
@cmccormack
Apr 19 2018 15:44
yeah it's true, and troubleshooting in node can be pretty difficult at times
Jason Luboff
@JLuboff
Apr 19 2018 15:44
Atleast the document style of Mongo/mongoose is easy to just get up and running. SQL...thats a whole different beast (database design is a bitch, which to an extent you do with mongoose)
Nate Mallison
@NJM8
Apr 19 2018 15:46
I have read though that MongoDB is not very secure, whereas SQL is more secure by nature and implementation, I don't really know the details.
@cmccormack That's why I was curious about who found my app, some Nigerian prince trying to get my config vars!
haha
Jason Luboff
@JLuboff
Apr 19 2018 15:47
There are definitely pro's and con's to each databse system
Christopher McCormack
@cmccormack
Apr 19 2018 15:47
Secure in what way? Data integrety or vulnerability?
Nate Mallison
@NJM8
Apr 19 2018 15:48
vulnerability
I assume that mLabs on Heroku is pretty secure
Christopher McCormack
@cmccormack
Apr 19 2018 15:50
did you read that article?
Sounds more like users of Mongo didn't read the docs well and left themselves vulnerable
Jason Luboff
@JLuboff
Apr 19 2018 15:51
Can'
t fix stupid
Christopher McCormack
@cmccormack
Apr 19 2018 15:52
The default posture is more insecure but it doesn't make Mongo more insecure. Other things can, no doubt, but that isn't what that article is referencing
Nate Mallison
@NJM8
Apr 19 2018 15:56
cool, heroku logs tell me the ip address of the requests it receives, looked it up, appears to have been a bingbot
Christopher McCormack
@cmccormack
Apr 19 2018 16:07
where did you see it was a bingbot?
Nate Mallison
@NJM8
Apr 19 2018 16:08
one of the ip address lookup websites that provides search data from 4-5 other lookup sites
Christopher McCormack
@cmccormack
Apr 19 2018 16:08
IP is not a very good way to determine who someone was
Nate Mallison
@NJM8
Apr 19 2018 16:08
3 had Microsoft corp as the originating company and one had the Bingbot listed
4 results from Redmond WA, one from Va
Jason Luboff
@JLuboff
Apr 19 2018 16:32
ARrrgfghhh... I hate PHP
Christopher McCormack
@cmccormack
Apr 19 2018 16:32
@JLuboff are you the one that created that poll on my voting site?
Jason Luboff
@JLuboff
Apr 19 2018 16:33
@cmccormack ...Did you show it off months ago? IF so...perhaps...
Christopher McCormack
@cmccormack
Apr 19 2018 16:33
haha
someone named anonymous created that poll
Jason Luboff
@JLuboff
Apr 19 2018 16:33
I would have had to log in, wouldn't i? (To create the poll)
Christopher McCormack
@cmccormack
Apr 19 2018 16:34
yes
Jason Luboff
@JLuboff
Apr 19 2018 16:34
Then wasn't me
Christopher McCormack
@cmccormack
Apr 19 2018 16:35
oh sorry that was random not anonymous
voting is borked atm
Jason Luboff
@JLuboff
Apr 19 2018 16:36
Oh... I was going to say it gave me an error lol
But wow, that looks great man
@cmccormack May I make one suggestion though?
Christopher McCormack
@cmccormack
Apr 19 2018 16:42
@JLuboff thanks man!
CamperBot
@camperbot
Apr 19 2018 16:42
cmccormack sends brownie points to @jluboff :sparkles: :thumbsup: :sparkles:
:star2: 2405 | @jluboff |http://www.freecodecamp.org/jluboff
Christopher McCormack
@cmccormack
Apr 19 2018 16:42
what's up?
Jason Luboff
@JLuboff
Apr 19 2018 16:44
@cmccormack This was a suggestion on my voting app, that I haven't changed lol. But right now you're poll's change color every time the page is refreshed, this can be confusing to end users. I'd recomend (this is what I did for stock chart app) is storing the random color in the document for that option so it's always the same
Christopher McCormack
@cmccormack
Apr 19 2018 16:45
yeah I've thought about it, even started it a bit
it used to be worse, updated every vote
Jason Luboff
@JLuboff
Apr 19 2018 16:45
Thats how mine is (every vote) lol
Christopher McCormack
@cmccormack
Apr 19 2018 16:46
so now I have a seed value in react but haven't chosen to push to my db yet
but you have pushed me over that line, I'll add to db, thanks!
Jason Luboff
@JLuboff
Apr 19 2018 16:47
:D
I really really hate troubleshooting PHP...mainly becuase I don't know where to start lol
Christopher McCormack
@cmccormack
Apr 19 2018 16:49
start be removing it?
Jason Luboff
@JLuboff
Apr 19 2018 16:49
...I'd love to
unfortunately not an option right now
It just one of the forms not working...rest of the forms are (I believe). What the fuckk.
Christopher McCormack
@cmccormack
Apr 19 2018 16:55
is it difficult to log stuff?
Jason Luboff
@JLuboff
Apr 19 2018 16:56
I'm going to be real honest with you Chris
I have no clue how to log shit in PHP
Christopher McCormack
@cmccormack
Apr 19 2018 16:57
Hah
Jason Luboff
@JLuboff
Apr 19 2018 16:57
But hey! I got my test to work so thats a positive
Christopher McCormack
@cmccormack
Apr 19 2018 17:00
see you just needed to shout a bit
Jason Luboff
@JLuboff
Apr 19 2018 17:00
...but my test isn't using the same form.. so now I have to do that
Pieter Stokkink
@forkerino
Apr 19 2018 17:15
:wave:
Jason Luboff
@JLuboff
Apr 19 2018 17:15
@forkerino Morning! (afternoon..)
Christopher McCormack
@cmccormack
Apr 19 2018 17:16
yo
Pieter Stokkink
@forkerino
Apr 19 2018 17:16
Evening!
:P
Jason Luboff
@JLuboff
Apr 19 2018 17:16
I was close lol
Whats good?
Pieter Stokkink
@forkerino
Apr 19 2018 17:20
It's weekend for me, skies are blue, temps are @ 25 celsius, got a delicious pizza in front of me
not bad at all
Jason Luboff
@JLuboff
Apr 19 2018 17:21
Can't say that I'm not jealous
It is a beautiful day out..but I'm stuck working :P
Pieter Stokkink
@forkerino
Apr 19 2018 17:22
with php no less
Jason Luboff
@JLuboff
Apr 19 2018 17:22
Yes unfortunately :'(
What the helllllllllllllllllllllllllllll
Pieter Stokkink
@forkerino
Apr 19 2018 17:23
???
Jason Luboff
@JLuboff
Apr 19 2018 17:23
It seems to have randomly started working..
Pieter Stokkink
@forkerino
Apr 19 2018 17:23
those are the best
Jason Luboff
@JLuboff
Apr 19 2018 17:24
The original problem was when the form was submitted, it was acting like it couldn't find the PHP file
I verified other forms were working..meaning PHP was working.
So I just tested it again right now, but changed the $mailto variable to my email instead of selecting from a list based on location..and it worked (so thats the only thing I changed). Now to see if it works based on location
Nate Mallison
@NJM8
Apr 19 2018 17:27
@cmccormack I tried to vote but got this error: MongoError: The field 'voters' must be an array but is of type object in document {_id: ObjectId('5ac6f38abd8b7d00a0e286a4')}
maybe you already know that?
Jason Luboff
@JLuboff
Apr 19 2018 17:27
Nope... doesn't work. So there's something messed up in my logic or my variable isn't getting set right or something. Hmm
Christopher McCormack
@cmccormack
Apr 19 2018 17:27
i do but thanks @NJM8
CamperBot
@camperbot
Apr 19 2018 17:27
cmccormack sends brownie points to @njm8 :sparkles: :thumbsup: :sparkles:
:cookie: 420 | @njm8 |http://www.freecodecamp.org/njm8
Christopher McCormack
@cmccormack
Apr 19 2018 17:27
just that one poll I screwed it up
Jason Luboff
@JLuboff
Apr 19 2018 17:27
@forkerino Any plans for the weekend?
Nate Mallison
@NJM8
Apr 19 2018 17:28
Ah ok, digging the style, I really like MaterializeCSS
Christopher McCormack
@cmccormack
Apr 19 2018 17:29
thanks yeah it's great but next time I won't use framework css
Nate Mallison
@NJM8
Apr 19 2018 17:29
you mean framework styling only?
Pieter Stokkink
@forkerino
Apr 19 2018 17:29
I plan on seeing some friends and going to the forest for a walk with my daughter. @JLuboff
Nate Mallison
@NJM8
Apr 19 2018 17:30
I've gone the other way with my front end apps, got sick of trying to make the framework do what I wanted
Jason Luboff
@JLuboff
Apr 19 2018 17:30
@forkerino Awesome, sounds lkike a good weekend
Christopher McCormack
@cmccormack
Apr 19 2018 17:30
i'll just extract what I want and use it myself
Pieter Stokkink
@forkerino
Apr 19 2018 17:30
@JLuboff you any nice plans?
Jason Luboff
@JLuboff
Apr 19 2018 17:31
@forkerino Mmm.. not too much this weekend. Going to a surprise birthday dinner for a friend. Thats about it I think. Taking a week off work the first week of May so that'll be nicer plans (going to do a little road trip up the coast)
Pieter Stokkink
@forkerino
Apr 19 2018 17:32
Road trip! Sounds cool, I'm in dire need of some holiday as well. Winter was long. I might work remote for some time if the schedule allows it.
Jason Luboff
@JLuboff
Apr 19 2018 17:33
Ya hopefully the little man won't be too much trouble with the car rides haha
Pieter Stokkink
@forkerino
Apr 19 2018 17:33
Yeah, that can be a challenge sometimes.
Jason Luboff
@JLuboff
Apr 19 2018 17:33
It'd be nice to be able to work remote but I don't see it working with my job (I still need to do too much with physical computers and such)
Pieter Stokkink
@forkerino
Apr 19 2018 17:35
I'm enjoying working in the office sometime, but sitting on a beach in Thailand while doing my work would be nice.
Jason Luboff
@JLuboff
Apr 19 2018 17:35
Ya I don't think anyone could argue that
Nate Mallison
@NJM8
Apr 19 2018 17:37
Can you guys take a peek at my file metadata to make sure it works? https://natethedevfilemetadata.herokuapp.com/
Jason Luboff
@JLuboff
Apr 19 2018 17:38
@NJM8 Seems like it does
Christopher McCormack
@cmccormack
Apr 19 2018 17:39
size seems a little off but i remember that happening on mine too
like 20KB
Nate Mallison
@NJM8
Apr 19 2018 17:40
I'll just add 20 kb to each one
:smile:
Thanks for looking
Will Foster
@Will5592
Apr 19 2018 17:40

Hi guys,

I'm plugging away at the FCC Calculator challenge, and it's pretty tough but i feel like I'm making progress but I've hit a bit of a wall.

Anyone able to take a look at my progress and just have a quick breeze through to see if the road I'm going down with it is at all viable? Or whether it's a bad way to go (ideally it will be the former)...

Thanks : https://codepen.io/Will5592/pen/ZxmEBq?editors=1011

Nate Mallison
@NJM8
Apr 19 2018 17:41
now to decide on a framework for dynamic apps. Vue? Angular? React?
Pieter Stokkink
@forkerino
Apr 19 2018 17:43
@NJM8 If this is the first time you choose one, either Vue or React
I'd say
Vue is probably more simple
But I like React too
Nate Mallison
@NJM8
Apr 19 2018 17:45
I did some Angular in the past, and Ionic, I liked the way it works. I know everyone is hot for React right now, Vue is becoming popular too
I guess it doesn't really matter, If I show I can learn one and a potential employer learns another I can learn it
@Will5592 That would be a fine way to go with the logic so far, what I would consider right now is how you are going to evaluate the input to get the results
that will change a lot about how you do things
Christopher McCormack
@cmccormack
Apr 19 2018 17:46
With React you would have a bit more support in here
Nate Mallison
@NJM8
Apr 19 2018 17:48
In my area there is plenty of React and Angular work
Will Foster
@Will5592
Apr 19 2018 17:48
@NJM8 Indeed, that's my main challenge with this. I'm a bit lost as to how to proceed, as I have plenty of ideas about how I might be able to check for situation A, or situation B, but not a concise way of doing it for every eventuality...
Nate Mallison
@NJM8
Apr 19 2018 17:52
@Will5592 The calculator was one of the first where I missed a lot of input possibilities, it definitely can be complex. Look at language parsers for your evaluation of the input, that will define how you input things and then how you deal with different input cases, like negatives and decimals, not repeating decimals, etc etc.
Will Foster
@Will5592
Apr 19 2018 17:57
@NJM8 Ok thanks, what are language parsers? Are they specific JS built in functions?
CamperBot
@camperbot
Apr 19 2018 17:57
will5592 sends brownie points to @njm8 :sparkles: :thumbsup: :sparkles:
:cookie: 421 | @njm8 |http://www.freecodecamp.org/njm8
Nate Mallison
@NJM8
Apr 19 2018 18:01
It's more of a general process. https://en.wikipedia.org/wiki/Parsing
It's a fancy way of saying, how are you going to process the input to the calculator, left to right? PEMDAS? how will you know where to do addition or subtraction. so you are working through the input string to decide what to do with it
There are lots out there already for calculators but you will learn a lot trying to make your own
Christopher McCormack
@cmccormack
Apr 19 2018 18:04
I learned I don't like making calculators
Will Foster
@Will5592
Apr 19 2018 18:04
Yeah I learned that pretty quick lol
Nate Mallison
@NJM8
Apr 19 2018 18:04
haha
Christopher McCormack
@cmccormack
Apr 19 2018 18:05
I'd highly suggest writing out on paper what yout think the process should be, what happens when you hit a digit, equals, an operator, etc..
at some point you'll see a pattern that will work for you
Will Foster
@Will5592
Apr 19 2018 18:05
Yeah probably a good idea
Jason Luboff
@JLuboff
Apr 19 2018 18:05
Yup. This is why I hate PHP. It is awful.
Nate Mallison
@NJM8
Apr 19 2018 18:05
the parser is the easy part, if your input is perfect, that's what i struggled with, making sure the input was correct and didn't have errors
Jason Luboff
@JLuboff
Apr 19 2018 18:06
The exact same logic that works for one form...doesn't work for another even though they have almost the exact same structure
Nate Mallison
@NJM8
Apr 19 2018 18:08
you know what they say about almost
Will Foster
@Will5592
Apr 19 2018 18:08
I have the ability to add a number, an operator, and another number and then total it. You can string together extra actions (another +5, another -7 etc etc), I can clear to nothing, I have just implemented a function that checks if there is an existing '.' and doesn't allow another one, but that won't work, because you could have 5.5+5.5,
So the calculator kind of works, but I don't know if that was the easy part or not
because obviously, you can still type 55++++++++------.5
Christopher McCormack
@cmccormack
Apr 19 2018 18:09
@Will5592 maybe don't keep the left side of your operator in the buffer
is it a user story to allow chaining like that?
Will Foster
@Will5592
Apr 19 2018 18:11
@cmccormack Yes, it is a user story unfortunately. What do you mean by buffer, i.e. the current total string before the latest operator?
Christopher McCormack
@cmccormack
Apr 19 2018 18:11
I don't think it's a user story to keep it all on the same screen
just that you can chain together operators
so maybe if you have 5 then hit + it puts 5 in an accumulator, then you hit 5 again then + it sums that value with the accumulator and displays the accumulator
Will Foster
@Will5592
Apr 19 2018 18:13
@cmccormack Yeah ok, I see what you mean, perhaps I'm overcomplicating it by trying to display the path as well as the total?
Christopher McCormack
@cmccormack
Apr 19 2018 18:14
might as well use eval if you're just going to put it all on the screen like that
Will Foster
@Will5592
Apr 19 2018 18:14
I am :)
Christopher McCormack
@cmccormack
Apr 19 2018 18:14
eval takes most of the work out of this one :)
Jason Luboff
@JLuboff
Apr 19 2018 18:17
I used eval even though technically it was security vulnerabilities.. but I didn't see the issue with that project
Christopher McCormack
@cmccormack
Apr 19 2018 18:18
besides it doing all the work for you?
:D
Nate Mallison
@NJM8
Apr 19 2018 18:19
eval aka plz hack here
Christopher McCormack
@cmccormack
Apr 19 2018 18:20
I mean it's a front end app without any cross site requests so I don't really see the issue but still
unless you use shady library scripts or something
Jason Luboff
@JLuboff
Apr 19 2018 18:22
@cmccormack ... I mean ya it did a good chunk of the work for me...but....I still had to do parts of it! :P
Will Foster
@Will5592
Apr 19 2018 18:23
Is it bad practice to use eval? Isn't it a JS function, and therefor part of the language?
Christopher McCormack
@cmccormack
Apr 19 2018 18:23
hehe
Brad
@bradtaniguchi
Apr 19 2018 18:25
Its there, but its like opening the door to get hacked haha
Will Foster
@Will5592
Apr 19 2018 18:25
I think that might be above my pay-grade at the moment
Christopher McCormack
@cmccormack
Apr 19 2018 18:25
That's why I didn't mention security concerns, just how it takes the work out of doing the math :)
Will Foster
@Will5592
Apr 19 2018 18:25
I'm only making a calculator for FCC, not a secure web-app
:)
Christopher McCormack
@cmccormack
Apr 19 2018 18:25
@bradtaniguchi yo
Brad
@bradtaniguchi
Apr 19 2018 18:26
Hey
Pieter Stokkink
@forkerino
Apr 19 2018 18:26
@Will5592 You'll learn waaaaaay more if you don't use eval
Christopher McCormack
@cmccormack
Apr 19 2018 18:30
that project really taught me how to compartmentalize my functions and avoid tightly coupling functionality
wouldn't have gotten as much out of it if I used eval
Jason Luboff
@JLuboff
Apr 19 2018 18:31
Wow. Think I finally fixed my PHP issue...had to retype out my if/else if/else condition for who to email...even though nothing is different... I don't understand why.. but I'll accept my fate
Christopher McCormack
@cmccormack
Apr 19 2018 18:32
maybe broken white space characters? Did you copy it from somewhere?
Will Foster
@Will5592
Apr 19 2018 18:33
@forkerino I see your point, but at the moment I'm struggling even with using eval, so I'm wondering if I should just use it at this point and focus on learning all the other bits in order to not overload myself
Also, .indexOf can be used on an array?! I just used it on an array and it worked, I though it was just strings
Christopher McCormack
@cmccormack
Apr 19 2018 18:34
it's not overloading yourself to learn how a calculator works, that's the whole project
Jason Luboff
@JLuboff
Apr 19 2018 18:34
@cmccormack I copied it directly from another working form and didn't work.
Christopher McCormack
@cmccormack
Apr 19 2018 18:35
weird
@Will5592 plus it's not like you aren't experiencing different issues using eval anyhow
Pieter Stokkink
@forkerino
Apr 19 2018 18:37
@Will5592 general advice: break you problem down into smaller pieces, and try to solve those. You know all the basic operations, now it is time to put things together.
Jason Luboff
@JLuboff
Apr 19 2018 18:37
Man.. it is not my day...can't sysprep this new computer either. Ugh. Haven't had any luck with sysprep'ing Windows 10
Will Foster
@Will5592
Apr 19 2018 18:38
@forkerino I have tried to do that so far, I don't struggle with the idea of adding, subtracting the numbers etc. It's just I can't think of a way of combining the left hand side with the right hand side, with an operator inbetween, only when = is pressed
Pieter Stokkink
@forkerino
Apr 19 2018 18:41
@Will5592 you'd have to store them in a variable somewhere (lefthand, righthand and operator, for example)
The way I did it: start by filling the lefthand var, when you hit an operator, fill that one, all numbers after should be the righthand var and when you hit =, do the math.
Nate Mallison
@NJM8
Apr 19 2018 18:43
Question about api's, so I made all these api's for the backend cert, but when I try to use them I get the cross-origin request blocked error
Christopher McCormack
@cmccormack
Apr 19 2018 18:43
@NJM8 you'll have to allow it on the server
several ways to do it
Nate Mallison
@NJM8
Apr 19 2018 18:44
do I have to set something on the server?
Christopher McCormack
@cmccormack
Apr 19 2018 18:44
are you using apache?
Nate Mallison
@NJM8
Apr 19 2018 18:44
no
what's apache
Pieter Stokkink
@forkerino
Apr 19 2018 18:44
Christopher McCormack
@cmccormack
Apr 19 2018 18:44
@NJM8 web server
Nate Mallison
@NJM8
Apr 19 2018 18:44
is that something that needs to be done for all apis?
Christopher McCormack
@cmccormack
Apr 19 2018 18:45
I think you're using github right?
Nate Mallison
@NJM8
Apr 19 2018 18:45
@cmccormack this is on github and heroku
well, no only heroku
Christopher McCormack
@cmccormack
Apr 19 2018 18:45
oh sorry duh api - you have to allow in your server file
one sec
Nate Mallison
@NJM8
Apr 19 2018 18:45
I'm not hosting them on github
Christopher McCormack
@cmccormack
Apr 19 2018 18:45
> npm i -S cors
...
const cors = require('cors')
...
app.use(cors())
gotta install of course
but this is easiest way
@NJM8 sorry I only half read your original question
Nate Mallison
@NJM8
Apr 19 2018 18:47
thats ok
I finally found a one sentence description that makes cors make sense, funny how sometimes that's all it takes
Christopher McCormack
@cmccormack
Apr 19 2018 18:48
save it and share it when people ask
and share it now
now!
Nate Mallison
@NJM8
Apr 19 2018 18:48
Since the same origin policy enforces that we can not run JavaScript on another domain
that's it
that's all you need
I've read 3 page articles that didn't make a lick of sense
and that's all you need to know right there, well maybe not all. but still
the whole paragraph:

When setting up a Node.js API on its own (without any kind of front-end), we will be accessing the API most likely from a different domain. Since the same origin policy enforces that we can not run JavaScript on another domain, we need to enable our API to bypass that security policy through allowing certain origins (domains).

Cross Origin Resource Sharing (or CORS) is one way of doing this. By adding specific headers on the server, we can enable browsers to execute JavaScript on the domain that the API is hosted on. To enable CORS, we can either manually add the headers ourselves, or use the helpful CORS module.

Christopher McCormack
@cmccormack
Apr 19 2018 18:50
well you should include who is actually blocking it, what a domain is, etc...
but you could make a bit more detailed short summary to share
Jason Luboff
@JLuboff
Apr 19 2018 18:51
I've never had any CORS issues with my APIs... at least not that I know of.
Nate Mallison
@NJM8
Apr 19 2018 18:51
why doesn't the FCC cirricullum cover it though? seems silly to make apis that don't work
@JLuboff Have you tried accessing your api's programmatically?
Christopher McCormack
@cmccormack
Apr 19 2018 18:52
hmm doesn't it have a linked article during that part?
Jason Luboff
@JLuboff
Apr 19 2018 18:52
Yup
Nate Mallison
@NJM8
Apr 19 2018 18:52
or through the url
Jason Luboff
@JLuboff
Apr 19 2018 18:52
In fact... I think it was @cmccormack who used my Simpsons API
Kudzu
@czhower
Apr 19 2018 18:52
basically its because of hacking - when you include JS and some other resources from a diff domain, you need to take steps to tell the browser "this is ok, its not a hack"
Tiago Correia
@tiagocorreiaalmeida
Apr 19 2018 18:53
hello everyone
Kudzu
@czhower
Apr 19 2018 18:53
in most cases its done by adding a header to the other server so when the browser pulls it, it knows its allowed to mix the code. But there are other methods depending on how you are mixing the code.
Will Foster
@Will5592
Apr 19 2018 18:54
@forkerino Ok, but what if the user types 5+5+5 before pressing equals, you then need 3 variables
Nate Mallison
@NJM8
Apr 19 2018 18:54
so the cors module tells your browser it's ok to use my js
Will Foster
@Will5592
Apr 19 2018 18:54
and so on and so forth
Kudzu
@czhower
Apr 19 2018 18:55
I havent looked at that module specifically, was talking about CORS itself. Normaly the easiest method is to add headewrs to the external server - thats what CDNs do.
Christopher McCormack
@cmccormack
Apr 19 2018 18:55
you're hosting on Glitch they may allow it by default @JLuboff
Kudzu
@czhower
Apr 19 2018 18:55
Thats why you can load say JQ from a CDN , but not some friends server unless they add the header.
Christopher McCormack
@cmccormack
Apr 19 2018 18:55
or maybe its in your code :)
Pieter Stokkink
@forkerino
Apr 19 2018 18:57
@Will5592 Ok, if you want to account for those kinds of situations, you need to evaluate it on every operator. Obviously, operator precedence would then also need to be taken into account.
I'd advice making it work for simple calculations first
Nate Mallison
@NJM8
Apr 19 2018 18:58
@cmccormack @czhower Now what about call back functions, does the server need to deal with that at all or just set the headers and the ajax code deals with the callbacks right?
Christopher McCormack
@cmccormack
Apr 19 2018 18:59
jsonp?
Nate Mallison
@NJM8
Apr 19 2018 18:59
uhhh, sure
Jason Luboff
@JLuboff
Apr 19 2018 18:59
@cmccormack Thats true. I didn't do anything explicitly to allow it. But then again, I don't know that I've tried say, accessing it from an http page
Kudzu
@czhower
Apr 19 2018 19:00

@NJM8 Call backs are a different issue than loading of resources. I havent done cross domain posts for a long time and so I would have to look up the current state of affairs myself. But generally its a bad idea to post from the FE to differnet domains and very problematic.

If you need to cross domains for data posting, better to let the BE resend it or move between domains for the HTML/FE first.

And this is an area that constantly changes due to security.. so what works today, might not next month or next year and can be impacted not only by browsers but also by anti virus software etc.
Will Foster
@Will5592
Apr 19 2018 19:01
@forkerino Yeah ok, I think I've over complicated it. Maybe need to start again
Nate Mallison
@NJM8
Apr 19 2018 19:03
ok, so once I've got the cors module up and working any style of request should work
Christopher McCormack
@cmccormack
Apr 19 2018 19:03
if you configured it right
Nate Mallison
@NJM8
Apr 19 2018 19:05
well, so a fetch request works, so an ajax or http or whatever will work?
Christopher McCormack
@cmccormack
Apr 19 2018 19:06
should
Will Foster
@Will5592
Apr 19 2018 19:07
I just watched a video of a guy using .indexOf with jQuery and he was able to do: .indexOf('string1', 'string'2', 'string3', 'string4'). Basically checking for 4 different string values at the same time. Is that a specific jQuery thing or can it be done in JS too (didn't work when I tried it). I tried reading the docs, but it isn't overtly clear...
Christopher McCormack
@cmccormack
Apr 19 2018 19:07
depends on what that method is attached to
is it a jquery object?
Will Foster
@Will5592
Apr 19 2018 19:08
No it's an array
Christopher McCormack
@cmccormack
Apr 19 2018 19:08
did they use apply?
hmm wait that wouldn't work either
Will Foster
@Will5592
Apr 19 2018 19:09
No
Christopher McCormack
@cmccormack
Apr 19 2018 19:09
yeah that may be custom to the object, are you use it's a normal array?
did they change the method in the prototype?
Will Foster
@Will5592
Apr 19 2018 19:09
The entire line of code is if(inputs[inputs.length-1].indexOf('+','-','*','/',)===-1
Where inputs is an array
well, the original array is defined as [""]
Jason Luboff
@JLuboff
Apr 19 2018 19:11
that usauge of indexOf definitely is not standard
Christopher McCormack
@cmccormack
Apr 19 2018 19:11
may be missing something.
arr.indexOf(searchElement[, fromIndex]) // <== should only take two arguments max
Jason Luboff
@JLuboff
Apr 19 2018 19:11
I think you're mistaking indexOf for jQuery's inArray()
Christopher McCormack
@cmccormack
Apr 19 2018 19:12
share the vid
Jason Luboff
@JLuboff
Apr 19 2018 19:12
jQuery does not have a seperate indexOf
and actually.. inArray may not work that way either
Mois├ęs Man
@moigithub
Apr 19 2018 19:13
maybe should be like this ? if ( ['+','-','*','/'].indexOf(inputs[inputs.length-1])===-1
soo inputs[inputs.length-1] point to something like '+' @Will5592
From 12m17s
I wish it wouldn't use that huge window link...
Gulsvi
@gulsvi
Apr 19 2018 19:14
If any of you use VS Code, how do you get it to show console output on save? Or, do you all run a command prompt/powershell in parallel and just switch context after every save?
Brad
@bradtaniguchi
Apr 19 2018 19:15
@gulsvi Idk how your running your code, but I use a dropdown terminal to "run everything"
sounds like your own windows tho, idk what sorta support there is for a dropdown terminal.
Christopher McCormack
@cmccormack
Apr 19 2018 19:15
@gulsvi ctrl + ~
I think
hmm maybe alt + `
I have my own aliases sorry
Gulsvi
@gulsvi
Apr 19 2018 19:16
That gives me a terminal window, but then I have to do something like node script.js to run it and see results. Was hoping to have that done automatically for me on save
Christopher McCormack
@cmccormack
Apr 19 2018 19:16
can use nodemon
Brad
@bradtaniguchi
Apr 19 2018 19:17
^
Jason Luboff
@JLuboff
Apr 19 2018 19:17
nodemon :heart:
Gulsvi
@gulsvi
Apr 19 2018 19:17
Hmmm, never heard of that :) will look it up! Thanks @cmccormack @bradtaniguchi
CamperBot
@camperbot
Apr 19 2018 19:17
gulsvi sends brownie points to @cmccormack and @bradtaniguchi :sparkles: :thumbsup: :sparkles:
:star2: 1418 | @cmccormack |http://www.freecodecamp.org/cmccormack
:cookie: 464 | @bradtaniguchi |http://www.freecodecamp.org/bradtaniguchi
Brad
@bradtaniguchi
Apr 19 2018 19:17
I dislike built in terminals tho, takes up precious screenspace.
Gulsvi
@gulsvi
Apr 19 2018 19:18
easy to hide/remove with that ctrl + ~ command though :)
Christopher McCormack
@cmccormack
Apr 19 2018 19:18
I like it because I need my log statements constantly haha
I use this script if it helps - "dev": "nodemon --ignore src/ --ignore public/ server.js ",
otherwise it updates too often
replace those dirs with your source and build dirs
Gulsvi
@gulsvi
Apr 19 2018 19:19
Wow, nodemon is awesome - just what I wanted!
Bummer there isn't a built in way to do it in VS Code
Christopher McCormack
@cmccormack
Apr 19 2018 19:19
one of my fav tools
you probably can
Gulsvi
@gulsvi
Apr 19 2018 19:20
Now, to figure out the options - getting a bit too much verbosity on what nodemon is doing
[nodemon] clean exit - waiting for changes before restart
[nodemon] restarting due to changes...
hello world!
[nodemon] clean exit - waiting for changes before restart
[nodemon] restarting due to changes...
Christopher McCormack
@cmccormack
Apr 19 2018 19:20
you just need to run a daemon that's watching for changes to files, like how sass --watch works and some other tools like eslint
webpack as well
Gulsvi
@gulsvi
Apr 19 2018 19:21
I have eslint almost set up the way I want, webpack is definitely somewhere down the road to auto-minify stuff on save
Brad
@bradtaniguchi
Apr 19 2018 19:22
I guess I'm spoiled with multiple screens haha, and I remapped the home key to show/hide the terminal. Plus its transparent so I technically can edit code behind it.
Gulsvi
@gulsvi
Apr 19 2018 19:22
I have a 3-monitor setup back home, just a laptop here unfortunately
so hard to get used to one 13" monitor lol
Christopher McCormack
@cmccormack
Apr 19 2018 19:23
that's why I love my mac - multiple desktops with a simple swipe
did win 10 add multiple desktops?
Tiago Correia
@tiagocorreiaalmeida
Apr 19 2018 19:24
@forkerino that first exercise :\
Gulsvi
@gulsvi
Apr 19 2018 19:24
Windows has had multiple desktops since Windows XP
Just no easy three-finger swipe on the trackpad to use it
Christopher McCormack
@cmccormack
Apr 19 2018 19:25
really, xp?
I thought vista may have had it but I don't remember xp having anything like that
Pieter Stokkink
@forkerino
Apr 19 2018 19:25
@tiagocorreiaalmeida didn't do it. :smile: I'm a bit too tired after work.
Gulsvi
@gulsvi
Apr 19 2018 19:25
Windows XP Power Toys - an add on. I think it's built in to windows 10 now
Christopher McCormack
@cmccormack
Apr 19 2018 19:25
ah ok
Pieter Stokkink
@forkerino
Apr 19 2018 19:25
I should probably veg out and netflix @tiagocorreiaalmeida
Tiago Correia
@tiagocorreiaalmeida
Apr 19 2018 19:26
ahaha sounds like a good idea :D, what series have you been watching?
Brad
@bradtaniguchi
Apr 19 2018 19:27
Yea windows 10 has it native, Idk how to use it tho
Mac people swipping all around looking all cool :sunglasses:
Pieter Stokkink
@forkerino
Apr 19 2018 19:29
@tiagocorreiaalmeida Dirk Gently
I love it
Tiago Correia
@tiagocorreiaalmeida
Apr 19 2018 19:30
I watched recently one called mecanismo
its about brasil corruption
quite good
Christopher McCormack
@cmccormack
Apr 19 2018 19:31
@bradtaniguchi it sure does feel cool :)
Pieter Stokkink
@forkerino
Apr 19 2018 19:32
@tiagocorreiaalmeida that one is in my list of recommendations too. Dirk Gently is just funny (it is based on the books by Douglas Adams, of Hitchhiker's Guide to the Galaxy)
Tiago Correia
@tiagocorreiaalmeida
Apr 19 2018 19:32
never heard of it will give it one try someday :D, do you use nodejs at work?
Pieter Stokkink
@forkerino
Apr 19 2018 19:33
Honestly, can't go wrong with Douglas Adams
@tiagocorreiaalmeida No, we use Python/Django
only use node for frontend build
with webpack
but don't serve anything with node
Tiago Correia
@tiagocorreiaalmeida
Apr 19 2018 19:34
I see thanks :D, also some other good series are true detective and narcos, I mean there's so much stuff to watch at this point
Pieter Stokkink
@forkerino
Apr 19 2018 19:34
@tiagocorreiaalmeida I've seen both!
Tiago Correia
@tiagocorreiaalmeida
Apr 19 2018 19:36
then you know what's a really good series, rust on true detective was something really...
Pieter Stokkink
@forkerino
Apr 19 2018 19:38
@tiagocorreiaalmeida Did you watch Black Mirror? It is probably my favorite from the last years
Tiago Correia
@tiagocorreiaalmeida
Apr 19 2018 19:38
uh no but a friend of mine told me to I will have to give it a try aswell, just one question tough have you watched season two of true detective?since alot of people dont like it
Pieter Stokkink
@forkerino
Apr 19 2018 19:39
@tiagocorreiaalmeida I thought it was great
Christopher McCormack
@cmccormack
Apr 19 2018 19:39
it's really good
Tiago Correia
@tiagocorreiaalmeida
Apr 19 2018 19:39
same here, plus the ending was unexpected but brilliant, I tough it had some kind of message on it
Kudzu
@czhower
Apr 19 2018 20:18
To anyone using JQuery CDN. There is a problem that started today with their SSL certificate.
blob
Christopher McCormack
@cmccormack
Apr 19 2018 20:20
hah
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:20
I am learning about node, and in the course, he's mentioning that I can use either pug or ejs
from what I see ejs does what angular does, which is templating, does that mean it's either one or the other?
Kudzu
@czhower
Apr 19 2018 20:21
only affects ssl. But many apps default to SSL because you can use SSL CDN on non SSL app without problem, but not the other way around.
Christopher McCormack
@cmccormack
Apr 19 2018 20:21
they're both templating
there are lots of templating engines
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:21
so do I use either one of them, or both together? I mean he only mentioned 2 as if they are the best ones out there, so am wondering why he didn't mention angular as well
Brad
@bradtaniguchi
Apr 19 2018 20:21
Angular is a front-end framework, it does templating on the client-side, not the server side (like pug).
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:21
or do they have better usage in that case than angular?
oh, so it's server-side vs client-side
Brad
@bradtaniguchi
Apr 19 2018 20:22
For the most part yea, when you serve the index.html, Angular is sent to the client and builds the UI and does everything on the client machine
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:22
but.. he's using ejs and pug on index.pug and index.ejs that are served to the user, isn't this client-side?
Christopher McCormack
@cmccormack
Apr 19 2018 20:22
No, templates are compiled into html before being served
Brad
@bradtaniguchi
Apr 19 2018 20:22
^
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:23
ok
so I can't use angular with express
Christopher McCormack
@cmccormack
Apr 19 2018 20:23
you sure can
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:23
view engine = angular
Christopher McCormack
@cmccormack
Apr 19 2018 20:23
you're not required to use any templating engine
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:23
I mean server side
Christopher McCormack
@cmccormack
Apr 19 2018 20:23
you can write static, use template, use React/Vue/Angular, whatever
it's up to you how you implement
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:23
something like this
app.set('views', './src/views');
app.set('view engine', 'angular');
does it work?
Christopher McCormack
@cmccormack
Apr 19 2018 20:23
nope
that's for templating
angular isn't templating
it's javascript
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:24
but it has the {{ }}
which is used for templates, right?
Brad
@bradtaniguchi
Apr 19 2018 20:24
thats just a convension
Christopher McCormack
@cmccormack
Apr 19 2018 20:24
it's within an attribute isn't it?
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:24
yeah
but angular can use it without attributes too
Christopher McCormack
@cmccormack
Apr 19 2018 20:24
that's still all javascript in some way
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:24
i mean, what makes a library server side only
Christopher McCormack
@cmccormack
Apr 19 2018 20:24
templates are not usable until compiled
just the engine and template are server side, it compiles to regular html
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:25
so ..
can't we use the engine and template, to write angular template syntax?
or mustache syntax
but more like angular
ng-for ng-if
and generat ethat on server, send it to the client
?
just like what handlebars do, they have server side hbs, and they have the handlebars client side i believe
Christopher McCormack
@cmccormack
Apr 19 2018 20:26
@brittanyrutherford sorry I don't really use templates much after the first few FCC courses on backend, but if you can find a way go for it
it doesn't change that angular is different than a template
Brad
@bradtaniguchi
Apr 19 2018 20:26
Id assume pug and ejs has their own syntax instead of ng-if, ng-for (that's how angularjs updates the DOM on the client-side)
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:27
yeah, I thought angular would be similar to handlebars, where there's hbs for server side, and for client side templating
but probably not
Brad
@bradtaniguchi
Apr 19 2018 20:27
Nope, angular does everything on the client-side. The server serves just the index.html, and provides endpoints to get data. Angular handles what the app looklikes.
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:28
great, now I get it, he was explaining them without mentioning other libraries.. thanks guys @bradtaniguchi @cmccormack
CamperBot
@camperbot
Apr 19 2018 20:28
brittanyrutherford sends brownie points to @bradtaniguchi and @cmccormack :sparkles: :thumbsup: :sparkles:
:cookie: 465 | @bradtaniguchi |http://www.freecodecamp.org/bradtaniguchi
:star2: 1419 | @cmccormack |http://www.freecodecamp.org/cmccormack
Christopher McCormack
@cmccormack
Apr 19 2018 20:28
np
Brad
@bradtaniguchi
Apr 19 2018 20:28
Idk how handlebars works, but Angular has no server side unless were talking about Angular universal
Christopher McCormack
@cmccormack
Apr 19 2018 20:28
just wait until you get to React and JSX :)
Brad
@bradtaniguchi
Apr 19 2018 20:28
Or just stick with Angular :P
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:28
i'll stick with angular
i already worked with it a bit, it's nice
Brad
@bradtaniguchi
Apr 19 2018 20:29
:+1: @brittanyrutherford Angularjs or Angular 2+ ?
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:29
very similar to handlebars (the {{ }} ) syntax
@bradtaniguchi both
Brad
@bradtaniguchi
Apr 19 2018 20:29
Ah nice
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:30
@bradtaniguchi I had to fix some code on 2 projects, each one with a different version of angular
so I learned a bit here and there
so the question is.. if you use server side templating, would u ever use client-side templating with it at the same time?
like, can I use ejs, then on the client side use angular? or that doesn't make sense?
Brad
@bradtaniguchi
Apr 19 2018 20:31
I was going to say earlier you technically could but its overly complex for little reason.
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:31
ok, so basically it's one or the other
Brad
@bradtaniguchi
Apr 19 2018 20:32
I mentioned Angular Universal (for Angular 2+) which basically does that for you. The main issue with client-side rendering is it doesn't work for search engines (since you only serve the index.html)
But yea, I would never try to put the those together unless your angularjs is very tiny, or you need SEO with Angular 1
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:33
why client-side templating isn't good for SEO?
Brad
@bradtaniguchi
Apr 19 2018 20:35
The web crawlers will come to your page and sees just the empty index.html (it doesn't render the javascript from angular) so it basically finds nothing, no links, information and leaves. For example you can bookmark an angular app and in some browsers it will show you a "preview" sometimes it will be like a 404 page or empty/unrendered JS, due to the same problems
Compared to a server-side rendered page, the web crawler will get all the html rendered as expected from the server, and follow all the links/etc info.
Christopher McCormack
@cmccormack
Apr 19 2018 20:37
why wouldn't they load the js? gotta be a lot of sites that load all their data from APIs and web crawlers would be blind to all of them wouldn't they?
Brad
@bradtaniguchi
Apr 19 2018 20:38
Idk why or how it works. I just know that its a concern with angular.
Christopher McCormack
@cmccormack
Apr 19 2018 20:38
interesting
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:38
but
Brad
@bradtaniguchi
Apr 19 2018 20:38
Idk if the same affects react, vue or any of the other SPA frameworks/libs
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:38
why is everyone using client-side libraries
like angular, react, veu
Christopher McCormack
@cmccormack
Apr 19 2018 20:39
because they're fast
you can build single page apps (SPA) that are very powerful
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:39
but if search engines won't find ur site.. what's the benefit?
Christopher McCormack
@cmccormack
Apr 19 2018 20:39
and much faster at rendering
I think he just said angular1 had that issue
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:39
aaah
Christopher McCormack
@cmccormack
Apr 19 2018 20:39
but it's a good question
I'd like to know more about that
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:40
i can't see the different in that between angular 1 and 2
both of them receive raw html from the server
and then style it on the client side
behavior with search engines should be the same right
Brad
@bradtaniguchi
Apr 19 2018 20:40
Angular 2 has the same issue, but there's the Universal project which basically renders the first "page" for web crawlers then transisitons to a normal angular 2 app.
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:41
but..
web crawlers, crawl content
content already exists in html returned to client
so why does it need to care if u format it, or make the whole page hidden
if it's going to crawl that returned html?
from what I know
web crawlers will look into the file's contents, not the display itself
it'll read even js and css files returned
Brad
@bradtaniguchi
Apr 19 2018 20:42
When you server an angularjs app, the index is empty for the most part, there is no content. (angular loads it later)
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:43
but the content is returned from the server (yet the client doesn't see it until angular formats it)
but the content is returned
web crawlers read that returned content I believe
i don't think web crawlers act as a browser and care if the page is empty or not
i think they act like fiddler
Brad
@bradtaniguchi
Apr 19 2018 20:44
Im not sure what content your refering too
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:44
the html itself
Brad
@bradtaniguchi
Apr 19 2018 20:44
Theres only the index.html file, thats it
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:44
but the content that will shape the paragraphs and divs
where would it be?
it would be somewhere returned from the web server right?
if u request that same url in fiddler, u must see that content returned somewhere
Brad
@bradtaniguchi
Apr 19 2018 20:45
Yea but Angular needs to make extra async calls after it loads to get that data, and render it as HTML on the client-side
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:45
aaah
now i get it
Brad
@bradtaniguchi
Apr 19 2018 20:46
usually that data is JSON, but regardless the web-crawlers don't see it until its compiled to HTML which it prolly doesn't care
I was looking into the current state of things, apparently Google says their crawlers DO run JS, so it would see more. But there's other issues like the fact there still is 1 page (index.html), which isn't good for SEO (I guess)
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:46
what if index.html sends the data as json to the client, and angular doesn't make anymore calls, should be fine in this case
Brad
@bradtaniguchi
Apr 19 2018 20:47
idk what you mean if index.html sends data to the client.
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:47
sorry wrong wording
I mean
the server sends json data along with index.html
so u dont have to do more requests
in this case, web crawler will see it
Brad
@bradtaniguchi
Apr 19 2018 20:47
What if the JSON gets to the client before the index?
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:48
how can this happen?
isn't the html the first thing that's returned from the server?
Brad
@bradtaniguchi
Apr 19 2018 20:48
You said "along" so that means a parellel request
If that's not the case, same thing as before, its an async call from the client-side.
Brittany Rutherford
@brittanyrutherford
Apr 19 2018 20:49
hmm
interesting
pug syntax is awful, not sure how people like it :-1:
Brad
@bradtaniguchi
Apr 19 2018 20:55
I never used pug so idk
Jason Luboff
@JLuboff
Apr 19 2018 20:56
I love me some hbs (aka handlebars)
Not the most powerful of template engines...but I can make it do what I want
Brad
@bradtaniguchi
Apr 19 2018 21:03
The only experience I had with handlebars/pug was fixing a tiny issue with some email templates. I think it used handlebars, but it wasn't much more than a typo
Jason Luboff
@JLuboff
Apr 19 2018 21:06
HBS is pretty straightforward. If you want more advanced functionality, you have to program it yourself (by creating a helper function) but it's not too difficult
Brad
@bradtaniguchi
Apr 19 2018 21:14
I never got around to making a backend-only express app, and wasn't sure if I wanted to use pug or handlebars (didn't hear of ejs at the time). Never found a good project idea tho
Jason Luboff
@JLuboff
Apr 19 2018 21:16
I'm usre you can figure out something to build
Brad
@bradtaniguchi
Apr 19 2018 21:21
It polly would work with some API or something, I hate the idea of doing a CRUD app
Nate Mallison
@NJM8
Apr 19 2018 22:11
pug is terrible
the pits
Jason Luboff
@JLuboff
Apr 19 2018 22:12
Of course it is with an attitude like that
Nate Mallison
@NJM8
Apr 19 2018 22:15
no it really is bad, documentation is terrible to
ejs is better, hbs I didn't use much
although ejs docs pretty short, like, a page, haha
Jason Luboff
@JLuboff
Apr 19 2018 22:23
hbs docs aren
't very long but I've used it enough to know what to do
Brad
@bradtaniguchi
Apr 19 2018 22:38
That moment when you gotta clear chrome cuse a page is taking nearly 4gb
Jason Luboff
@JLuboff
Apr 19 2018 22:39
@bradtaniguchi memory leak..?
Brad
@bradtaniguchi
Apr 19 2018 22:39
I believe its all from hot-module reloading from hours of work
Jason Luboff
@JLuboff
Apr 19 2018 22:40
Sounds hot
Brad
@bradtaniguchi
Apr 19 2018 22:46
in a super deep voice Oh yea