These are chat archives for FreeCodeCamp/HelpJavaScript

19th
Jun 2018
Boris
@Boris1011
Jun 19 2018 00:15
Hi everyone, I was wondering if there was something similar to .push that will actually make the item "stick" as such?? So that the item will stay on reload...
Tom
@moT01
Jun 19 2018 00:26
sounds like you want to use some local storage https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage @Boris1011
Zunaid Aslam
@ZunaidAslam
Jun 19 2018 08:12

Why does this work?

let a = 8, b = 6;
(() => {
  "use strict";
  console.log(a); // should be 6
  console.log(b); // should be 8
  // change code below this line
  [a,b]=[b,a];

  // change code above this line
})();
console.log(a); // should be 6
console.log(b); // should be 8

but this doesn't

let a = 8, b = 6;
((a, b) => {
  "use strict";
  console.log(a); // should be 6
  console.log(b); // should be 8
  // change code below this line
  [a,b]=[b,a];

  // change code above this line
})();
console.log(a); // should be 6
console.log(b); // should be 8
Aditya
@ezioda004
Jun 19 2018 08:19
@Zunaid-Aslam You arent passing arguments in the second code so a and b are undefined and [a,b]=[b,a]; is swapping the arguments of the function and not the variables defined before the function. Remember parameters are functional scoped too.
Zunaid Aslam
@ZunaidAslam
Jun 19 2018 08:22

@Zunaid-Aslam You arent passing arguments in the second code so a and b are undefined and [a,b]=[b,a]; is swapping the arguments of the function and not the variables defined before the function. Remember parameters are functional scoped too.

While I kind of got the first one with my limited knowledge. The code can access the values of a and b and as a result swapping it.

I thought maybe passing a and b as arguments would do the same. But you are telling me i am not passing arguments. But didn't i just pass a and b as arguments in the second one.

Aditya
@ezioda004
Jun 19 2018 08:35

@Zunaid-Aslam See its a IIFE (Immediately invoked function expression) so the parentheses after the function is how you pass the arguments.

((x, y) => { //x, y are parameters
  //do something
})(a, b) //a, b are the arguments

This is equivalent of doing

(function someFunc(x, y){ 
  //do something
})(a, b);

More simplified form

function someFunc(x, y){ 
  //do something
};
someFunc(a, b);

So in above examples x, y are local variables to the function. Anything you do to them wont affect a and b because primitive values are passed by value

In your 2nd example notice nothing is being passed in the last parentheses
((a, b) => {
  "use strict";
  console.log(a); // should be 6
  console.log(b); // should be 8
  // change code below this line
  [a,b]=[b,a];

  // change code above this line
})(); //no arguments are being passed here so a and b are undefined
Nate Mallison
@NJM8
Jun 19 2018 13:05
Has anyone done the Rosetta Code challenges in the interview prep section?
They made 24 game much harder than it's supposed to be
Santosh Vijapure
@santoshvijapure
Jun 19 2018 14:24
sup !!
Jason Luboff
@JLuboff
Jun 19 2018 15:06
@NJM8 I've only done the first one hah
Markus Kiili
@Masd925
Jun 19 2018 15:10
Yo.
Jason Luboff
@JLuboff
Jun 19 2018 15:13
Yo yo yo
Markus Kiili
@Masd925
Jun 19 2018 15:20
@JLuboff I haven't written any JS for a month. Getting cold turkey.
Jason Luboff
@JLuboff
Jun 19 2018 15:33
@Masd925 Thats disappointing. Get to it!
jusgoose
@gusd773
Jun 19 2018 18:58
@cmccormack you were right flex box is the bees knees thank you
Christopher McCormack
@cmccormack
Jun 19 2018 18:59
@gusd773 np man glad you're getting good results with it
Jason Luboff
@JLuboff
Jun 19 2018 19:03
:fire:
@cmccormack What do you know about package.json scripts?
Christopher McCormack
@cmccormack
Jun 19 2018 19:07
ugh I know that you don't need to reference the node_modules directory when using them
I've built lots of different scripts, what's up?
Jason Luboff
@JLuboff
Jun 19 2018 19:10

Ah... I think I figured out a work around.. or I guess using it properly. . but essentially I want this

  "scripts": {
    "start": "set NODE_ENV=production&&node app.js",
    "test": "set NODE_ENV=development&&node app.js"
  },

But I was trying to give them custom names (i.e startProd, startDev) but looks like I may have had to do something like npm run-script startProd instead of npm startProd

Christopher McCormack
@cmccormack
Jun 19 2018 19:11
hmm can't you do that without set?
Brad
@bradtaniguchi
Jun 19 2018 19:11
if the script name was startDev shouldn't it run with npm run startDev?
and yea IDK if you need set
Jason Luboff
@JLuboff
Jun 19 2018 19:12
Not positive...thats just what I had found in the past to set it to dev mode
Christopher McCormack
@cmccormack
Jun 19 2018 19:12
yeah npm run start would be it
@JLuboff I think you can do NODE_ENV=production node app.js
Jason Luboff
@JLuboff
Jun 19 2018 19:14
npm run startProd worked. I do need the set though..it errored otherwise. But let me try without the &&
Ya looks like it needs the set
Christopher McCormack
@cmccormack
Jun 19 2018 19:14
yeah maybe on windows
Jason Luboff
@JLuboff
Jun 19 2018 19:14
and the &&
Christopher McCormack
@cmccormack
Jun 19 2018 19:14
yes if you're using set
you could also use your .env if you wanted
Jason Luboff
@JLuboff
Jun 19 2018 19:16
True..but I'm only using dotenv in my configs file, not that I couldn't include it elsewhere
Christopher McCormack
@cmccormack
Jun 19 2018 19:16
I think I used to use crossenv as I develop on my Mac and my PC
Brad
@bradtaniguchi
Jun 19 2018 19:19
How does crossenv work?
Christopher McCormack
@cmccormack
Jun 19 2018 19:20
it's a module that you pass the commands you want to run and it should work on most platforms
Example used by author:
{
  "scripts": {
    "build": "cross-env NODE_ENV=production webpack --config build/webpack.config.js"
  }
}
You don't actually need to use crossenv for webpack but it should work for a regular node app
Brad
@bradtaniguchi
Jun 19 2018 19:21
hmm, in what kind of situation would I need that tho? I bounce around different platforms and haven't had much issues
Christopher McCormack
@cmccormack
Jun 19 2018 19:22
maybe a logger or testing or something in your server you don't want to run in prod
Jason Luboff
@JLuboff
Jun 19 2018 19:23
Alright... got that going. So now just to make some changes between production and dev along with handling errors in some way...and I'll be done. But for now...time for the gym! See you guys in a bit
Christopher McCormack
@cmccormack
Jun 19 2018 19:23
@JLuboff later homie
with webpack you can pass something like --env.production then use it in your webpack config like
module.exports = env => {
console.info(`webpack env: ${env.production ? "production" : "development"}`) // just to validate
I like that better, maybe node has something like that too but I didn't see it
Christopher McCormack
@cmccormack
Jun 19 2018 19:30
@bradtaniguchi not sure if I answered your q much, wasn't sure if you meant cross-env in general or why you would need prod/dev flags in your node app
jusgoose
@gusd773
Jun 19 2018 19:33
anybody know how I can split the boxes labeled 'rates' with div class= 'rate-option' into 2 vertical sections?
https://codepen.io/gusd773/pen/aKyepO
image.png
Christopher McCormack
@cmccormack
Jun 19 2018 19:34
@gusd773 use flexbox!
jusgoose
@gusd773
Jun 19 2018 19:34
similar to how each of the three boxes here are made up of 2 vertical secitons with the grey background and white background;
@cmccormack I just got lost trying that rn
Christopher McCormack
@cmccormack
Jun 19 2018 19:35
I call that type of element a Card
for your card, you can apply
display: flex;
flex-direction: column;
jusgoose
@gusd773
Jun 19 2018 19:36
and then just add 2 divs inside my rate option card?
Christopher McCormack
@cmccormack
Jun 19 2018 19:36
but you can just add block elements within your div even without flexbox
jusgoose
@gusd773
Jun 19 2018 19:37
@cmccormack i'm trying to master flex box, less steps imo
Christopher McCormack
@cmccormack
Jun 19 2018 19:37
yeah just make a div for header, content, footer or whatever
I also suggest giving each section a different background-color temporarily while you build the card, so you can see how it's positioned, padding/margin/etc...
jusgoose
@gusd773
Jun 19 2018 19:41
@cmccormack thank you that helped
Christopher McCormack
@cmccormack
Jun 19 2018 19:41
I just realized I didn't use flex for my cards on that project, you can check it out if you want. Ignore the complicated selectors, I used SCSS to build the css
jusgoose
@gusd773
Jun 19 2018 19:48
@cmccormack any reason why my content won't fit inside my vertical divs inside my cards?
https://codepen.io/gusd773/pen/aKyepO
@cmccormack i'm regretting using flex box rn but i'm learning
Christopher McCormack
@cmccormack
Jun 19 2018 19:49
@gusd773 what isn't fitting?
jusgoose
@gusd773
Jun 19 2018 19:50
@cmccormack I added a small button but I'm researching how to make it look how I want
Christopher McCormack
@cmccormack
Jun 19 2018 19:50
you aren't using flexbox in your card from what I can see
jusgoose
@gusd773
Jun 19 2018 19:52
@cmccormack my cards have the class rate-option and in css i use display:flex and flex-direction:column
unless I have to apply the order to them then I think I am using it
Christopher McCormack
@cmccormack
Jun 19 2018 19:53
ah you must not have saved list time you linked it
Try to avoid setting height in percentages like you're doing, that's only going to cause problems
which it is here :)
better to let the content determine the size sometimes. You can use padding for the header, for example
or set the height explicitly with a pixel/em/rem
jusgoose
@gusd773
Jun 19 2018 19:56
@cmccormack i let it resolve itself lol I'll leave it up to the computers
Brad
@bradtaniguchi
Jun 19 2018 19:59
@cmccormack I was more asking about what cross-env works, and what problems it solves
Christopher McCormack
@cmccormack
Jun 19 2018 20:03
@bradtaniguchi I believe the scripts are shell scripts so if it's not supported on a specific platform crossenv handles all that
Brad
@bradtaniguchi
Jun 19 2018 20:04
Ah I see, so I could run a shell script thru this and it would work on windows as an example?
Christopher McCormack
@cmccormack
Jun 19 2018 20:05
I believe that's the idea
but I think it's more related to how the environmental variables work
different on windows vs mac/linux
like how to set them etc...
Brad
@bradtaniguchi
Jun 19 2018 20:11
Ok, so the way you were setting the NODE_ENV environment variable could be different depending on platform then?
but by passing it to cross-env, its the "same" since cross-env handles it
Christopher McCormack
@cmccormack
Jun 19 2018 20:11
I think so :)
Brad
@bradtaniguchi
Jun 19 2018 20:12
Ah I see the light haha, thanks :D
Christopher McCormack
@cmccormack
Jun 19 2018 20:12

The problem

Most Windows command prompts will choke when you set environment variables with NODE_ENV=production like that. (The exception is Bash on Windows, which uses native Bash.) Similarly, there's a difference in how windows and POSIX commands utilize environment variables. With POSIX, you use: $ENV_VAR and on windows you use %ENV_VAR%.

This solution

cross-env makes it so you can have a single command without worrying about setting or using the environment variable properly for the platform. Just set it like you would if it's running on a POSIX system, and cross-env will take care of setting it properly.

Brad
@bradtaniguchi
Jun 19 2018 20:24
Ill definantly have to use it the next time I need to set environment variables in my npm scripts
Lately Ive just been using .env, but thats more for "global" variables, not to flag to build for prod (if its an angular project the cli handles it another way)
Christopher McCormack
@cmccormack
Jun 19 2018 20:29
Yeah I tend not to use those flags in my server but instead in my build toolchain using webpack
but I make simple apps for FCC not robust solutions :)
Always interested what others do
Brad
@bradtaniguchi
Jun 19 2018 20:31
So about webpack, you build your configs from scratch for that thing? Webpack is still magic for me for the most part haha
Christopher McCormack
@cmccormack
Jun 19 2018 20:31
yeah I've been growing my config over time. I wanted to see what's inside so I stopped using CRA
Brad
@bradtaniguchi
Jun 19 2018 20:32
CRA?
Christopher McCormack
@cmccormack
Jun 19 2018 20:32
Here's my latest @bradtaniguchi , not very complex https://github.com/cmccormack/nightlife/blob/master/webpack.config.js
along with scripts that call prod/dev:
  "scripts": {
    "start": "npm run build && node server.js",
    "build": "webpack --env.prod",
    "dev": "webpack --env.dev",
    "startdev": "nodemon server.js",
    "webpackdev": "webpack --env.dev --watch",
    "test": "mocha"
},
yeah sorry Create React App - it hides the webpack stuff inside
Jason Luboff
@JLuboff
Jun 19 2018 20:32
@cmccormack Same idea by setting the NODE_ENV, I can do
const url = process.env.NODE_ENV === 'production' ? 'http://myProdServer' : 'http://localhost:3000';
Brad
@bradtaniguchi
Jun 19 2018 20:33
aaahh
Have you (or anyone) used parcel for react? Ive been checking it out, I like it a lot, but idk about how much I can get out of it. I ran into a few bugs with my custom setup (multiple pages, typescript, a game lib)
Christopher McCormack
@cmccormack
Jun 19 2018 20:34
I have not
I worry that it claims to be simple but will instead still require me to make a config for any exception
and bundlers can be the hardest thing to troubleshoot so if you get something that works, stick to it haha
Bjorn van de Peut
@bjorno43
Jun 19 2018 20:35
:wave:
Christopher McCormack
@cmccormack
Jun 19 2018 20:35
@bjorno43 yo
Jason Luboff
@JLuboff
Jun 19 2018 20:35
@bjorno43 Afternoon
Bjorn van de Peut
@bjorno43
Jun 19 2018 20:35
Hey guys @JLuboff @cmccormack @bradtaniguchi
Brad
@bradtaniguchi
Jun 19 2018 20:36
Hello :D
yea, I wanted to see how far I could get with it, since we had a gulp setup previously, but it was plain JS. Now if we want to use typescript wed need babel in there somewhere
Bjorn van de Peut
@bjorno43
Jun 19 2018 20:37
Everytime I hear babel I'm thinking about babelfish. The online translator before Google had one xD
Christopher McCormack
@cmccormack
Jun 19 2018 20:38
similar concept :)
@bradtaniguchi you can use babel cli can't you?
Brad
@bradtaniguchi
Jun 19 2018 20:39
are you asking about ability(I never tried) or in the gulp-pipline we were using(isn't there a gulp plugin for that :P)?
Jason Luboff
@JLuboff
Jun 19 2018 20:39
Any suggestions on error handling in production? My current thought is to log it (I'll be using PM2 so I can look back on the log) along with having an email sent to me with the error..
Christopher McCormack
@cmccormack
Jun 19 2018 20:40
you can probably pipe it through babel as a script if you don't want to try and implement it in parcel
@JLuboff syslog server!
Bjorn van de Peut
@bjorno43
Jun 19 2018 20:40
Aaaand.. I was just asked to become an Admin on the largest chatsite here in the Netherlands.. probably the worst place to be xD
Jason Luboff
@JLuboff
Jun 19 2018 20:41
@cmccormack syslog is for linux?
Christopher McCormack
@cmccormack
Jun 19 2018 20:42
syslog is a generic term
but there should be some syslog modules on npm, and setting up a syslog server is easy
Bjorn van de Peut
@bjorno43
Jun 19 2018 20:42
Told them they don't want me as an Admin there, ghehe
Brad
@bradtaniguchi
Jun 19 2018 20:42
AFAIK parcel will look at my tsconfig, thru typescript so it "should" handle it automatically (at least thats what I believe) I was running into some issues with it tho it seemed with the compiled code "breaking" when I extended a class, so I changed the target from es5 to 6 and it started working. But I THINK it might of been a caching issue
Christopher McCormack
@cmccormack
Jun 19 2018 20:43
@bjorno43 sounds like no fun
Brad
@bradtaniguchi
Jun 19 2018 20:43
regardless I REALLY don't want to use webpack for the project (or gulp for that matter) I'm too lazy XD
Christopher McCormack
@cmccormack
Jun 19 2018 20:43
@bradtaniguchi does it look at .babelrc as well?
Brad
@bradtaniguchi
Jun 19 2018 20:43
Idk if typescript requires that AFAIK. Hell idk if it even uses babel under the hood
of typescripts compiler that is
Jason Luboff
@JLuboff
Jun 19 2018 20:44
@cmccormack ehhhh.... Maybe thats something I'll add in the future lol
Christopher McCormack
@cmccormack
Jun 19 2018 20:44
I mean... if you don't need to use a bundler why would you want to
Bjorn van de Peut
@bjorno43
Jun 19 2018 20:44
@cmccormack Nope. On one hand you have an office that's unwilling to hire any decent programmers. So they're just buying unfinished scripts online and mess around with them while running it live. On the other hand you have the worst of worst members from our country in there. Everything is about 18+ if you get what I mean..
Christopher McCormack
@cmccormack
Jun 19 2018 20:44
@JLuboff you may want it to queue up errors for a while before sending you an email at least :)
Brad
@bradtaniguchi
Jun 19 2018 20:44
Ah looks like typescript DOESN'T use babel
Christopher McCormack
@cmccormack
Jun 19 2018 20:45
@bradtaniguchi does it have its own transpiler?
Jason Luboff
@JLuboff
Jun 19 2018 20:45
@cmccormack I don't suspect there will be many errors as expections are that there will be sub-100 requests a year
Christopher McCormack
@cmccormack
Jun 19 2018 20:46
@JLuboff famous last words
Jason Luboff
@JLuboff
Jun 19 2018 20:46
:joy:
Worst case if I am getting too many emails I implement a different solution then
Christopher McCormack
@cmccormack
Jun 19 2018 20:47
new email account?
Jason Luboff
@JLuboff
Jun 19 2018 20:47
Exactly!
Christopher McCormack
@cmccormack
Jun 19 2018 20:47
@bjorno43 you should move!
Bjorn van de Peut
@bjorno43
Jun 19 2018 20:47
@cmccormack :joy:
Brad
@bradtaniguchi
Jun 19 2018 20:48
Yes, I guess so
Bjorn van de Peut
@bjorno43
Jun 19 2018 20:48
That's why I told them they don't want me. I'd probably ban 95% of the members.. xD
Jason Luboff
@JLuboff
Jun 19 2018 20:49
@cmccormack Looks like express has a best practice http://expressjs.com/en/advanced/best-practice-performance.html I'm reading it now
Bjorn van de Peut
@bjorno43
Jun 19 2018 20:49
Wait, let me show you something
Christopher McCormack
@cmccormack
Jun 19 2018 20:49
@bjorno43 do it, that would be funny
Bjorn van de Peut
@bjorno43
Jun 19 2018 20:49
chatplaza.png
That's what happened when I started monitoring their websocket. Just monitoring. Nothing else
Christopher McCormack
@cmccormack
Jun 19 2018 20:50
@JLuboff dang that's a lot of things I"m not currently doing
Bjorn van de Peut
@bjorno43
Jun 19 2018 20:50
I said: How much private info should I be able to see again..?!
Christopher McCormack
@cmccormack
Jun 19 2018 20:51
Is that a Java app?
Jason Luboff
@JLuboff
Jun 19 2018 20:51
@cmccormack Yup...same here. Like compression..
Christopher McCormack
@cmccormack
Jun 19 2018 20:51
@JLuboff thanks for sharing it - I've actually been curious about best practices when handling async calls
I've been using try/catch in mine but they offer some surprising ways to do it
Bjorn van de Peut
@bjorno43
Jun 19 2018 20:52
Ye that's OWASP ZAP. A penitration tool to check server security. Don't mess around with that on other ppl's servers though. It can get you into trouble ;)
Jason Luboff
@JLuboff
Jun 19 2018 20:53
I'm using promises mainly, no try-catch
Christopher McCormack
@cmccormack
Jun 19 2018 20:54
giphy.gif
Bjorn van de Peut
@bjorno43
Jun 19 2018 20:54
:joy:
Christopher McCormack
@cmccormack
Jun 19 2018 20:54
@JLuboff With async/await catching the reject or an error can be a bit more difficult so try/catch comes in handy
Bjorn van de Peut
@bjorno43
Jun 19 2018 20:56
It's a very usefull tool to check your own website(s) though. I mean, I thought my website was pretty secure, but it still found a few things I didn't think about
Christopher McCormack
@cmccormack
Jun 19 2018 20:57
I really like async/await, makes callback hell a bit easier to read
Jason Luboff
@JLuboff
Jun 19 2018 20:57
Its on my list
Bjorn van de Peut
@bjorno43
Jun 19 2018 20:57
Like for example that PHP was writing out a default session cookie with no HTTP only flag
Christopher McCormack
@cmccormack
Jun 19 2018 20:58
I'm terrified to look at my own server from a security standpoint
Bjorn van de Peut
@bjorno43
Jun 19 2018 20:59
Whaha :P
Christopher McCormack
@cmccormack
Jun 19 2018 20:59
Just worried it would tell me I'm doing a poor job
better to just put fingers in my ears
Bjorn van de Peut
@bjorno43
Jun 19 2018 21:00
Just give me your domain and permission, I'll check it out for you :P
Kelechi Chinaka
@ke1echi
Jun 19 2018 21:00
i feel so terrible with styling (css)
Christopher McCormack
@cmccormack
Jun 19 2018 21:00
Jason Luboff
@JLuboff
Jun 19 2018 21:01
@kelechy Hence why I use bootstrap or bulma :joy:
Christopher McCormack
@cmccormack
Jun 19 2018 21:01
@kelechy practice
Jason Luboff
@JLuboff
Jun 19 2018 21:01
@cmccormack I actually used to own that domain.... until godaddy wanted like $15 then I was all like "psh...ya right"
Bjorn van de Peut
@bjorno43
Jun 19 2018 21:01
@cmccormack Are you sure? I'm getting a 404 on that one
Christopher McCormack
@cmccormack
Jun 19 2018 21:02
@bjorno43 haha
Kelechi Chinaka
@ke1echi
Jun 19 2018 21:02
bootstrap? @JLuboff
Christopher McCormack
@cmccormack
Jun 19 2018 21:02
@JLuboff #takebackjluboffcom
Bjorn van de Peut
@bjorno43
Jun 19 2018 21:02
Oh lol, wait.. I see what you did there xD
Jason Luboff
@JLuboff
Jun 19 2018 21:02
Bjorn van de Peut
@bjorno43
Jun 19 2018 21:03
Honestly, I'd recommend Materialize over Bootstrap. It's easier and imho a lot better
Christopher McCormack
@cmccormack
Jun 19 2018 21:03
me too
Now I just steal some of their css stuff and put it in my own stylesheets
Bjorn van de Peut
@bjorno43
Jun 19 2018 21:05
Haha
Christopher McCormack
@cmccormack
Jun 19 2018 21:05
once you learn flexbox half their components dont' seem all that difficult anymore
Jason Luboff
@JLuboff
Jun 19 2018 21:05
I actually use https://bulma.io/ more frequently over bootstraP
Bjorn van de Peut
@bjorno43
Jun 19 2018 21:05
I've been messing around with Materialize a lot the past few weeks and I keep being amazed by it
But that's because (so far) I feel like they've thought about everything I encounter when doing front-end design
Christopher McCormack
@cmccormack
Jun 19 2018 21:07
Microsoft has their own styling I might check, Fluent
Yeah it's a great library
Bjorn van de Peut
@bjorno43
Jun 19 2018 21:08
No pushing around elements on mobile screens like Bootstrap does. Allowes you to hide elements on specific screens and replace them with other elements
Brad
@bradtaniguchi
Jun 19 2018 21:10
those buttons feel very old-school bootstrappy
Jason Luboff
@JLuboff
Jun 19 2018 21:10
materializes?
Bjorn van de Peut
@bjorno43
Jun 19 2018 21:10
Like for example I have a user menu on the left and my content on the right. On mobile screens, it just hides the user menu and makes the content full page. Top menus don't become drop-down menus on mobile, but actually turn into a mobile menu you can open with swiping
But ye, Materialize is made and maintained by Google. You kinda expect a good product from them :joy:
Christopher McCormack
@cmccormack
Jun 19 2018 21:14
Do you mean Materialize CSS? That is not maintained by Google, but Material Design is
Can you link it?
Bjorn van de Peut
@bjorno43
Jun 19 2018 21:15
Nah you're right. Guess I read that too fast last time
Christopher McCormack
@cmccormack
Jun 19 2018 21:18
I used Material UI React library on my last project, very interesting. It does a lot fo the work for you, so you can set primary/secondary colors and it will adjust all components based on those colors
Brad
@bradtaniguchi
Jun 19 2018 21:20
Same features for angular-material, themeing can be done in like 5 mins
Bjorn van de Peut
@bjorno43
Jun 19 2018 21:21
I haven't done React yet. Been thinking about learning it, but I've got so many projects going on right now. I just lack the time
Christopher McCormack
@cmccormack
Jun 19 2018 21:21
Does it use CSS-in-JS?
Brad
@bradtaniguchi
Jun 19 2018 21:21
angular-material?
Christopher McCormack
@cmccormack
Jun 19 2018 21:22
yeah
@bjorno43 I think it's worth it
Bjorn van de Peut
@bjorno43
Jun 19 2018 21:22
Got 2 websites, 1 chatsystem and 1 CRM system to develop first..
Christopher McCormack
@cmccormack
Jun 19 2018 21:22
Well if you're getting paid for it I can see why you would wait
Brad
@bradtaniguchi
Jun 19 2018 21:23
Not sure what your asking, but the css for each component can be defined on each component or globally. Not sure how the themes are used overall tho, I believe they just inherit from you app's style-sheet
Bjorn van de Peut
@bjorno43
Jun 19 2018 21:23
1 website is my own, but ye, getting paid for others obviously :P
Christopher McCormack
@cmccormack
Jun 19 2018 21:23
@bradtaniguchi my last project I had 0 stylesheets, just passed an object to a Higher Order Component and it built the CSS for me, injecting it into a style tag
was pretty nice
styled components does something similar, also very nice
Brad
@bradtaniguchi
Jun 19 2018 21:24
Yea idk much about the styling capabilities in angular haha
Bjorn van de Peut
@bjorno43
Jun 19 2018 21:25
I keep hearing that React is pushing Angular away lately. Something to do with Angular v2 I believe it was?
Christopher McCormack
@cmccormack
Jun 19 2018 21:25
it's not really angular so much as CSS-in-JS
Jason Luboff
@JLuboff
Jun 19 2018 21:25
Whoa... didn't think that compression module would make that big a difference...but... I'm seeing 10-20 ms quicker load times
Christopher McCormack
@cmccormack
Jun 19 2018 21:25
@bjorno43 people seem to like React because it's more pure javascript
Jason Luboff
@JLuboff
Jun 19 2018 21:26
And thats in dev mode, so no caching like we would have in prod
Christopher McCormack
@cmccormack
Jun 19 2018 21:26
@JLuboff does it get rid of your log statements?
:D
Jason Luboff
@JLuboff
Jun 19 2018 21:26
Only log statements I have are for errors at this point...and maybe one or two othe spots but routes themselves have no log statements :P
Bjorn van de Peut
@bjorno43
Jun 19 2018 21:27
@cmccormack Ye that makes sense. I'd prefer more pure js myself as well
Brad
@bradtaniguchi
Jun 19 2018 21:27
@cmccormack Yes, Angular(or 2+, its at 6 right now) is totally different than angularjs(1+) which threw off a lot of people during the transition. Plus it still provides a lot of stuff to handle almost anything. React is just a view lib
Christopher McCormack
@cmccormack
Jun 19 2018 21:28
@bjorno43 people look at JSX and think it's a bastardization but once you get used to it, it's really cool
Jason Luboff
@JLuboff
Jun 19 2018 21:28
Interesting...seems quicker in dev than prod..
Christopher McCormack
@cmccormack
Jun 19 2018 21:28
@JLuboff caching maybe?
Jason Luboff
@JLuboff
Jun 19 2018 21:29
prod should be caching...which...should be faster...no?
Given...I'm still having DB calls so that does affect it
Brad
@bradtaniguchi
Jun 19 2018 21:29
But I have been hearing, when starting Angular is hard to learn since there's so much (typescript, rxjs, modules, angular-syntax, etc) where as React is far more straight forward. BUT after that people feel like Angular is easier to use, since React doesn't "hold your hand" for advanced use cases. (This is only what Ive heard)
Christopher McCormack
@cmccormack
Jun 19 2018 21:30
@bradtaniguchi I can see that
If people just read the docs it would be a lot easier, Reactjs has wonderful documentation
I think Angular 2 was when a lot of people broke off to try React/Vue
Brad
@bradtaniguchi
Jun 19 2018 21:34
Yea I can see that, Angular 2 is only 1 year old. The betas/pre-releases had a lot of breaking changes too. (very little nowadays)
Brad
@bradtaniguchi
Jun 19 2018 23:08
Omg, I'm at a point when I find out I am missing part of a feature I'm happy. Today has been nothing but finding edge cases that are not covered :cry:
Jason Luboff
@JLuboff
Jun 19 2018 23:11
Sounds depressing
Brad
@bradtaniguchi
Jun 19 2018 23:13
Yea today is not my day
Jason Luboff
@JLuboff
Jun 19 2018 23:18
It'll get better
Brad
@bradtaniguchi
Jun 19 2018 23:27
it better get better, I'm writing more test-cases for the rest of the day, I see another refactor on a critical piece of code ahead
pein
@pein
Jun 19 2018 23:37
hello there!
Brad
@bradtaniguchi
Jun 19 2018 23:38
hello
pein
@pein
Jun 19 2018 23:38
I have some trouble with the destructive nested object es6 thing
Brad
@bradtaniguchi
Jun 19 2018 23:38
what do you have so far
// running test
nested destructuring was used
// tests completed
Jason Luboff
@JLuboff
Jun 19 2018 23:43
When I run that I do get 84.6?
pein
@pein
Jun 19 2018 23:43
yep
image.png
image.png
Brad
@bradtaniguchi
Jun 19 2018 23:46
wait...
The forecast argument isn't used in this function
unless thats just an example
Jason Luboff
@JLuboff
Jun 19 2018 23:46
@bradtaniguchi Nope..thats the problem, good catch
pein
@pein
Jun 19 2018 23:51
My bad!
thanx @bradtaniguchi :)
Brad
@bradtaniguchi
Jun 19 2018 23:56
np :D