« first day (3757 days earlier)      last day (1413 days later) » 

01:44
Reading some ReactJS code and am unclear why this has "snippets && snippets.map((..." could someone maybe give me a brief explanation of why the "&&"? (code to follow, can also see at: github.com/jamesqquick/…)
{snippets && snippets.map((snippet) => (
                        <Snippet
                            key={snippet.id}
                            snippet={snippet}
                            snippetDeleted={mutate}
 
7 hours later…
08:33
Guys how can i debug this
Failed to load config "react-app" to extend from.
Referenced from:
I have tried tampering with the eslint between eslint-config-react and esling-config-airbnb and cannot figure why it wont load the app on yarn start
09:07
hello,
@Glisten Welcome to the JavaScript chat! Please review the room rules. If you have a question, just post it, and if anyone's free and interested they'll help. If you want to report an abusive user or a problem in this room, visit our meta.
Hello, everyone.
It's first meet......
 
1 hour later…
10:31
does anyone know how to get around this?
11:05
i'm using react and ui material to make a website, but on mobile when we enter it zooms the page, any idea what is going on?
11:24
@makadev ya mate thnks for let me know that
    <!--
<meta name="viewport" content="width=device-width, initial-scale=1" /> -->
<meta name="viewport" content="width=device-width, maximum-scale=1.0, maximum-scale=1.0" />
that solved the problem
11:37
@NoobDEV-GBL Solves one, opens another. maximum-scale will prevent user zoom, normaly width=device-width, initial-scale=1.0 is enough on modern devices and recommend by literally everyone
@makadev ok thanks for the advise then, i will keep that in mind for next devs
@Petah what you are trying is generalization of a subtype, that's not allowed (it's against Covariance criterium afaik), see related proposal (also comments contain some hints on how to do something similar): github.com/Microsoft/TypeScript/issues/3402
hmm, im trying to extend a interface from a library thats incorrect, any idea how i should go about that?
12:05
in react with ui material, there are attribute props, and I wanted to implement attributes based on the media query ...
but my classes are in a js file and not theme
is more like: const classes = useStyles(props)()
i whant to change the variantes for tab panel...to be scrollable in mobile...
@Petah Ignore the typeinfo, write JavaScript glue code if possible, or fork the library and fix the typeinfo. Not sure if you are able to redeclare/replace other modules typeinfo and it sounds like a lot of effort to repair problem in your library/app that come from another lib.
so i need to make a funcion to get the current brakepoint not using theme becuse i have useStyles... any idea?
@Petah Or dunno.. force the type like so typescriptlang.org/play?#code/…
sry for the ping^
np mate
12:25
@NoobDEV-GBL having trouble understanding this, material-ui breakpoints are part of the theme so you need to access the theme to get them. useStyles should get theme as the first parameter for the style function thought
@makadev i know
    :51479616   const testes = (classes) => {
    const theme = classes
    const isSmallScreen = useMediaQuery(theme.breakpoints.down('xs'))
    // const isSmallScreen = useMediaQuery(theme => theme.breakpoints.down('xs'))

    const buttonProps = {
      variant: isSmallScreen ? 'text' : 'outlined',
      size: isSmallScreen ? 'small' : 'large'
    }
    return (
      console.log(buttonProps)
    )
  }
@NoobDEV-GBL Please don't post unformatted code - hit Ctrl+K before sending, use up-arrow to edit messages, and see the faq. You have 25 seconds to edit and format your message properly before it will be removed. Please separate code blocks from your actual question. Put your question in 1 message and then your code in a 2nd and format it.
For posting large code blocks, use a paste site like like gist.github.com, hastebin.com, pastie.org or a demo site like jsbin.com
that givs me error
React Hook "useMediaQuery" is called in function "testes" that is neither a React function component nor a custom React Hook function
ye, hooks must be called inside function components, what is testes or where/how is it used?
it's not a react component as it seems
:51479653 dud i complete miss the point... i had to import the theme normal and set the useMediaQuery as const the in the funcion i just use the const so now i dont get the error and it works
      const theme = useTheme()
  const screenMedium = useMediaQuery(theme.breakpoints.only('md'))
  const screenSmall = useMediaQuery(theme.breakpoints.only('sm'))
  const screenExtraSmall = useMediaQuery(theme.breakpoints.only('xs'))
  const screenNarrow = useMediaQuery('(max-width:340px)')
  const getScreenWidth = () => {
    if (screenMedium) {
      return 4
    } else if (screenSmall) {
      return 3
    } else if (screenExtraSmall) {
      return 2
    } else if (screenNarrow) {
      return 1
12:38
@NoobDEV-GBL Please don't post unformatted code - hit Ctrl+K before sending, use up-arrow to edit messages, and see the faq. You have 25 seconds to edit and format your message properly before it will be removed. Please separate code blocks from your actual question. Put your question in 1 message and then your code in a 2nd and format it.
For posting large code blocks, use a paste site like like gist.github.com, hastebin.com, pastie.org or a demo site like jsbin.com
Doesn't look much different than before, except for useTheme instead of passing it as props? Hu..
ya looks like he dont like the usetheme inside the function
Oh well.. if it works, it works... ._.
but maby is not the best way to do it
 
2 hours later…
14:22
@KarelG
@JBis

Is this alright now?
https://mistersircode.com/

I moved the entire site to an SSL-Verified HTTPS Website hosted via an Apache2 Server on a Debian 10 VPS. Im running everything off of some fancy htaccess logic and php files.

Ive also used a more streamlined / modern design created using Bootstrap

Furthermore, I found unlicensed artwork for the backgrounds and even credited the author
No more firebase. No more firestore. No more shit-ton-of-opacity areas
and the key feature of it all..... IT WORKS ON PHONES!
hey has anyone worked with react spring
@Gopherine Never heard of react "spring", but I know some people here use react, so wait a while and Im sure someone will pop up
@MisterSirCode looks much better, just not sure users would know to scroll down
@Gopherine ask your question
> Contact info if youre curious about something, or wish to hire me
spelling "you're"^
@JBis Possibly thinking of either creating a label attached to the bottom that says "Scroll down for content" or one of those dynamic arrows that points down and disapears
@JBis Minor error, but thanks either way
add an arrow
i had that on my website for a while
now mine is boring and bland
14:30
I just really wanted that nice "News article over a header background image" look
But I can see how thatd be confusing
Some browsers show the scroll bar, but specifically iphones and ipads dont
@MisterSirCode don't make it 100vh
make it like 70vh
@JBis if I make it too small, the background wont cover the screen...
or... actually, I could align by width
instead of height
that could work
I have a nice subdomain called beta.mistersircode.com
so I can throw the changes on there
test it before I send it to the main
@Gopherine Please don't post unformatted code - hit Ctrl+K before sending, use up-arrow to edit messages, and see the faq. You have 25 seconds to edit and format your message properly before it will be removed. Please separate code blocks from your actual question. Put your question in 1 message and then your code in a 2nd and format it.
For posting large code blocks, use a paste site like like gist.github.com, hastebin.com, pastie.org or a demo site like jsbin.com
1 message moved to Trash can
```js
  <a className="h-9" {...bind(navItem)}>
                {transitions.map(({ item, key, props }) =>
                  item === navItem ? (
                    <animated.div key={navItem} style={props}>
                      {item}
                    </animated.div>
                  ) : (
                    <animated.div key={navItem} style={props}>
                      {value}
                    </animated.div>
                  )
                )}
              </a>
```

basically i am using useTransition to transition this and change element on hove i have 5 items there which 
Javascript in html? man react is weird
Kinda looks like php though. Just a little
14:37
well its still 1000 times better then php e.e though i agree its weird
lately i am really interested in svelte but they have very less number of libaries and its not so mainstream so i cannot use it everywhere
@Gopherine Um... Its public code. PHP is completely serversided and safe
so 1000x better? um
I dont think so
can confirm, react is 1000x better than php
Actually, PHP is safe given that you have a good firewall / proxy and use SSL
@Wietlol Im sure its easier to use, but its not as safe
PHP is an in-place direct html templating engine
What's the english word for "a person who enrolled for a course/whatever"? - And what's the opposite "the one who actually enrolled the person who is enrolled"?
14:40
React/JSX is a model based, domain driven html templating engine
Like employer - employee, enroller, enrollee?
well because that serverside language does not look like serverside at all :D atleast this is clientside and it looks like clientside and eeeew the only people who use php for backend are the wordpress cults no real good backend project is written in php not anymore but well preferences
which is by far the biggest change that people have to make when learning React
as for security, React is perfectly safe
you just have to be aware that it is client side code and not server side code
by that definition every language is safe given ssl proxy lol deploy simplest things on cms and you get proxy ssl
@Wietlol exactly , i might not agree with jsx but no doubt react is way better then php if compared on technological perspective
the syntax is still a bit silly imho
but that is only because I have also used Kotlin-React
so, I have seen greener grass :)
14:45
Well SSL is more of a transfer safety certificate to encrypt data using an SSL Suite Modern Encoder.

What protects PHP is a good firewall
because without a firewall, people can get into your VPS and simply view the raw PHP
and then what?
well... id be more worried about the fact that they could delete the entire thing with a single command
hello
anyone here know crosh
i mean are you just throwing jargons here ? because those same things can be applied to any language duh
you can see the raw source code (unobfuscated and uncompiled) in all open source projects...
14:46
its more of systems admin thing not the language itself
they are still safe... at least some of them
point is you dont expose anything on clientside that you want to protect , as simple as that if anyone does then he is just a bad programmer
Im not throwing out "jargons"....

Sure any language can be safer.. however, raw HTML is still outputted to the user's client, and it can easily be viewed via source viewer, or just developer tools.

PHP however, is parsed and compiled on the server side, so only the HTML with the templated code gets returned to the client
its nearly impossible for the user end to see your PHP code without access to the VPS
If you dont know that, or claim its false, or believe its just "Jargon"... then you need to do some research..
Basic stuff
but it is not a security concern
Hence the reason I say PHP is safer.

Isnt react a front-end library? Just like most JS libraries?
14:50
Is there anybody who has experience in Google Maps APIs? I have a problem with printing the map
so, it is not safer
Unless youre talking about a React Pre-Processor... in which case, isnt that far from PHP
Yes, but data is stored on the backside. So it doesn't matter that a user can see or change anything.
anyone here know crosh
React is indeed a client-side tool
14:50
@Wietlol So a user CAN see its code
"Dont trust the user" is always true: so for any input you verify and validate it on the backend anyways.
While they cant see the PHP
and?
14:51
We don't keep all of the data in react native
use your brain... read between the lines... take the hint
are all open source projects "unsafe" because we can see the code?
@MisterSirCode .... How is that making things unsafe?
@Wietlol No? However, if you store private keys and certificates, then yes
I am trying to use my brain, but it isnt as big as yours, so I need a better hint
if you store private keys in PHP, you are also not really safe though
14:52
You can just not send private keys to the end user - you don't have to do that with react ever?
@Wietlol B|
@Wietlol Meh, it's not the worst; you'll have to store them "somewhere" on the backend anyways.
you have to store them, but not in your source code
@paul23 I mean if you use a 2FA based key system, something like Google Cloud Credentials, you can send your users all the tokens you want
and they still cant use them
While true I don't think that's the worst problem for in house closed source development.
14:54
you'd be surprised if you know how many people thought that until they got hacked...
Talking to me wietlol?
What I was simply saying, is that PHP is nearly 100% invisible to the user (Given that youre a competent coder and understand how to use it correctly and protect your server) which makes it very useful for authentication and protection
I mean if (backend!) source code gets hacked, they might as well hack the backend server; and somewhere there it's stored in some settings file.
I sure hope you are not storing the credentials in a settings file either
14:55
Where would you suggest to store them then?
you should use a secrets manager of some sorts
@paul23 if they really got into the backend server, id be more worried about the fact of all the private SSL keys and Credentials / SSH tokens, and possible cached login data on the server
Well that also depends on how you use it, and which platform you use it on
but generally you always store SOMETHING private on your backend
even if its just your github cached credentials for git-cli
I unfortunately store a lot of private data because I use a google cloud VPS
Problem with secrets manager is that they are terrible in cross platform support.
and it needs a lot of credentials and login info for service accounts to use the APIs
So you create a lot of vendor lock and at least we prefer the ability to quickly deploy.
14:57
@paul23 If something supports one linux platform, it usually supports all of the x64 / x86 based linux platforms and devices
except for debian OSs and arm-cpu based UNIX devices
like Raspberry Pis
I find a lot of packages that dont compile versions for arm
You'd be surprised how many differences there are. Between ubuntu, synology dsm, red hat, alpine..
Oh I know
the secrets manager doesnt have to be platform specific
I have many different restart commands alone just for Apache for the different linux distros Ive used
it can just be a web service that you can load the credentials from
14:59
let alone configuration and management commands
@Wietlol That too
but one that you whitelist your servers for so only they can get access to your secrets manager
@Wietlol uh now you get a chicken-egg problem: how would a server connect to the internet for the very first time then?
you dont need secrets to connect to the internet
yeah...
:S
Uh I mean: the link to such website (since if you use a service you NEED multiple to not get down once a service gets down, so you copy all secrets to multiple online services) would be stored in our database - but to access the database you need some login.... Which are stored in the online key.
15:03
I think youre overcomplicating it... You should always have some kind of private SSH / Control Key that lets you access the database / server in the first place.

From there, you can start a session and setup a firewall (like UFW) and setup locks that prevent access besides specialized logins from whatever site youre using
and most VPSs / Personal Servers have config that let you temporarily disable firewalls internally on restart incase you lock yourself out
I did that a couple times while setting up UFW for my server
locked myself out because I forgot to allow SSH with keys
well... first of all, depending on the technologies you use, you dont need multiple machines to run your sevices
so, you do not need to centralize your data of your keys, just the management
but even if you do, you can still whitelist only your secrets server to get access to said secrets database
but to be fair, I do not know the implementation details of such secrets managers
@Wietlol Well that sort of thing is application specific, so of course
there are many secrets managers, and theyll all most likely use something different
better or worse depending on your usecasse
keeping in mind we are talking about server secret managers, not the ones you use on your local machine
@Wietlol yes...
I wonder where Karel is... JBis gave me his thoughts on my new site
but I still want Karel's opinion on it
normally shes on around this time
she?
15:09
obviously Karel is a she :)
oh...
shoot
didnt you know paul?
I think there are too many dutch speaking people here.
hehe
I forgot... isnt it like "karl"
15:09
I guess...
I dont remember
Actually the english direct (historical) translation is "charles"
I just know a female person named "karel"
so I always assume KarelG is a "she" even though I remember now how we had a conversation about this
I do not know for sure though :P
Im pretttty sure KarelG is 100% a man after I remember the previous conversation about this
now I dont know if Karel has ever personally mentioned it
but Im pretty sure
|| shrug
15:13
¯\_(ツ)_/¯
15:32
@MisterSirCode the G stands for Guy. Checks out.
Although, on second thought it might stand for Gal
Or Gaul? Are we sure Karel is not a Celt from Continental Europe coming from the Roman period?
15:48
hey guys could anybody give me advice with this... I have got this route in flask https://dpaste.com/8RDJ94MYB receiving the data sent from this https://dpaste.com/GVAJE5GY8 react component that is getting the csrf_token on a get request and storing it to send with the form on post, hoping to get it to validate with wtforms through https://dpaste.com/46FEPBP3Z
the form will have more validators and I have the frontend already validating separately but trying to validate it in the back also
data is being sent as expected in json form
16:12
@MisterSirCode its not like i dont know but you are comparing here apple and oranges and trying to prove somethings superiority which is not its domain. Nodejs vs PHP would be a better comparison here. But it is secure enough as much as any client side technology needs. This is why i said comparing on technological perspective( what it achieves and hhow it tries to achieve it react is way better then php. and nodejs is way better then php if we are comparing on what a server side language can do
hello
16:24
Hey I want to reproduce a release/deploy locally on my machine to test out a feature
and I tried to do npm run build
but there's no build script in my package.json
I was wondering what is it normally set to if I'm using react and typescript?
@makadev hmm would that work within react
When I run the print function through datatables, if a cell has a bullet point in it, any clue why it won't get pulled through
@Kwsswart kinda ye, but with a bit of work if your component is compiled and loaded via bundle
you could put the csrf_token somewhere globally in the page and read it in your code when needed
there are problems thought
hmmm thanks will look into it currently getting the token on mount and storing in state
16:35
are you using any HTML @Kwsswart
If so be sure to include the meta tags
<meta name="_csrf" content="${_csrf.token}"/>
        <meta name="_csrf_header" content="${_csrf.headerName}"/>
then be sure to include the csrf token values in your ajax or fetch or whatever method you are using
@Kwsswart ^ what @bigchungus said, you can then read out the token from meta tag with something like that: stackoverflow.com/a/7524621/3828957 and set in your fetch headers similar to setting content type: developer.mozilla.org/en-US/docs/Web/API/Fetch_API/…
but it will timeout after 60 minutes (seems like the default setting for wtf forms: flask-wtf.readthedocs.io/en/stable/… )
after that you need a page refresh to get a new one
16:51
Anyone know any good full-stack courses?
I am technically doing a bit of front-end & back-end currently but on very small scale
@bigchungus very broad question take one step at a time. First try to reach intermediate level at either frontend or backend and then fill it by other half
17:12
also.. most full stack courses are practically bait, trying to lure you into some Vendor specific saas shet
@bigchungus I am only using html in the rendering of the form component
return (
            <div className="container">

                <h2>Register</h2>
                <form action="#">
                    <FormField type="text" fieldId="fullname" label="Full Name" validator={validateFullname} onStateChanged={this.fullnameChanged} required />
                    <EmailField fieldId="email" label="Email" onStateChanged={this.emailChanged} required />
                    <PhoneField fieldId="phone" label="Phone Number" onStateChanged={this.phoneChanged} required />
thats not HTML, it's JSX ;)
then no lol
essentially I need to find a way to enable the csrf into the headers but the csrf_token is being sent with the form with here
class Register extends Component {

    // State holds validity
    state = {
        csrf_token: '',
        username: false,
        fullname: false,
        email: false,
        phone: false,
        password: false,
        repeatPassword: false,
        passwordInput: '',
        repeatPasswordInput: '',
        usernameInput: '',
        fullnameInput: '',
        emailInput: '',
        phoneInput: ''
    };

    //HOF returns a state change watch function, setting the corresponding state property to true if the for field has no errors
getting loaded on mount as the csrf_token in state maybe I can get it into the headers form that
@Gopherine @makadev thank you
17:30
stackoverflow.com/a/65941859/11165703 Hey I actually got an answer accepted lol
@Kwsswart it should work, not exactly what I thought about but it should work
hmm is there a simple wiki that displays all markdown/commonmark syntacis
I think I broke it
6/5
@paul23 "markdown cheatsheet" on google
Millions of results
hundreds of github pages
hundreds of articles
custom websites
sure but is there a formal link I can point users to? Or would I have to write my own help.
17:37
@paul23 2nd result on google.

official pdf cheatsheet on markdown by Github Guides https://guides.github.com/pdfs/markdown-cheatsheet-online.pdf
|| shrug
¯\_(ツ)_/¯
Ive personally used that PDF in the past
before I didnt understand markdown
17:49
Anyone know of any Treeview js libraries
17:59
@bigchungus treeview?
like a linux tree command?
listing content in trees?
@MisterSirCode
I have data that isn't tabular, where I will have parent/child/grandchildren rows I feel like a tree view is what I am looking for
Oh I forgot about accordion
18:15
@bigchungus You could easily make one yourself with a small function using HTML Lists
but I see the need
tree views are useful
how so?
give the lists individual class or id (in this case #dDeliverable) and then say I have a JSON item called Deliverable

"Deliverable": $("#dDeliverable").val(),
@bigchungus What I mean is, you can just make a procedural function to shift through all the nested data, and for each nested data, go through all of the values / keys and values on each level and add HTML child lists
Procedural Nested Nests and things though
thats more complicated
but that can be dealt with aswell
Was going to say not to familiar with that, can you link me to anything helpful
18:21
Honestly Ive never made procedural nested readers before, but Ive seen it done a lot, so Ill try and find some info on it
Much appreciated
Found one about Tree View & Hierarchical Data but its C#
The thing I am seeing in common with all of the examples that I have found so far is that they are all collapsible structures. For example, I don't want any collapsible/expandable rows I need it displayed like so
Team = Heading

OffensiveReport = Subheading

DefensiveReport = Subheading

SpecialTeamsReport = Subheading

Coaches Notes = Subheading

                                    Football Weekly Report (page title = static)

                                Week Of (choose from filter/query based off WeekOf item)

Raiders

Offensive Report
  - (Here is the notes attached to that item from SharePoint form)

Defensive Report
  - (Here is the notes attached to that item from SharePoint form)

Special Teams Report
@bigchungus C# and JS Logic still follow Logical Rules, so you should be able to port it relatively easily
Understand that, but never used C# once in my life, don't want to waste a bunch of time learning that for this one small project when it is achievable in JS (atleast I hope, just have yet to figure out)
it only becomes hard to port things once you start getting into custom libraries and things
Eh, waste was a poor word choice
18:34
Thats a good one
Nested Nested Proceduralism
Sweet
So if I make headings and subheadings, and if there is nothing populated to the correlated data field to populate one of those subheadings, would it be too difficult to write a conditional to say if there is nothing to append there, to hide the subheading?
19:02
@bigchungus Just assign some sort of label or id to the subheading, and add a check in the nested nested function that, if it sees a label / id for a subheading, and it has no content, to not draw it or not render it / not use it
So yes
relatively simple
19:42
Why does every react site look the same
Is it that hard to make a badly looking react site?
@JBis because most of them use bulma or bootstrap or material ui to build their website so all their components looks same pretty much i mean not totatally
if anyone got time and some experience with react spring please look at github.com/pmndrs/react-spring/discussions/1265 this discussion and help me up thanks
20:01
posted on January 28, 2021 by Prudhvikumar Bommana

The Chrome team is excited to announce the promotion of Chrome 89 to the Beta channel for Windows, Mac and Linux. Chrome 89.0.4389.23 contains our usual under-the-hood performance and stability tweaks, but there are also some cool new features to explore - please head to the Chromium blog to learn more! A full list of changes in this build is available in the log. Interested in switching re

posted on January 28, 2021 by Srinivas Sista

 The Dev channel has been updated to 90.0.4400.8 for Windows,Linux and 90.0.4400.10 for Mac. A partial list of changes is available in the log. Interested in switching release channels? Find out how. If you find a new issue, please let us know by filing a bug. The community help forum is also a great place to reach out for help or learn about common issues. Google Chrome  Srinivas

20:32
o/
@JBis am I on the right track with this?
 
2 hours later…
23:01
posted on January 28, 2021 by Ben Mason

Hi everyone! We've just released Chrome Beta 89 (89.0.4389.23) for Android: it's now available on Google Play. You can see a partial list of the changes in the Git log. For details on new features, check out the Chromium blog, and for details on web platform updates, check here. If you find a new issue, please let us know by filing a bug. Ben Mason Google Chrome

pff spend 3 hours hunting "unused paramaters" in an older codebase
23:43
posted on January 28, 2021 by Marina Kazatcker

 The Stable channel is being updated to 88.0.4324.109, (Platform version: 13597.66.0) for most Chrome OS devices. This build contains a number of bug fixes and security updates. Systems will be receiving updates over the next several days. You can review new features here. If you find new issues, please let us know by vising our forum or filing a bug. Interested in swit


« first day (3757 days earlier)      last day (1413 days later) »