As I have explained in a previous post, we are developing a Javascript Frameworks React.js Community College Class, And we are using your “Learning React” book at the text for the class. And I have been working thru the book and coming up with ideas for Projects for the class.
I have 1 particular project that I am working on, and I would like to ask a few questions, and post some React.js code that I have developed…
However,
I don’t want the code to be visible to the students as they probably will be using this website for information while taking the class.
I’m wondering… Is there a way that I can create a “hidden” forum discussion that only myself and some of the moderators, etc can see so that students of the class do not find the answer to the project, just be reading thru these forum posts?
Greg Buchmann
I would suggest creating a direct/private message to one of the group you wish to discuss this with and then in that interface add more users to that message. This will keep that thread hidden from everyone except you and those in that message.
Any code that runs on the client/browser can be inspected and demystified with enough effort. The suggestion sen provides above is the best one, for now
Kirupa,
I am going to reply to the direct e-mail you sent me awarding me the shared June 2020 Forum new user of the month. Please look there for the information. I cannot figure out how to add people to that direct message or send you any other message for now. Anyway, look there for the code and the information. If you can help, that would be so great. Thanks.
I sent the e-mail thru the e-mail system here. The code that I pasted inline does not seem to show very well. But hopefully you can make it out. I don’t see any way to create attachments. I provided the URL to the code running, so hopefully you could also reverse engineer the code from there if you need to.
Greg Buchmann
I just replied asking you to post publicly here. We can archive the post from being viewed after you have your questions resolved.
Regarding your first question here, I misunderstood your request. I had interpreted your question as being more general. I didn’t realize you were asking about how you can use this forum for privately asking a question and getting it answered. Sorry for the runaround here.
I have been working on the issue behind this topic on my own, trying to figure out what the trouble is and how to fix it on my own. I’m now pretty sure the answers lie in this video on Youtube that I’m about to link. This is very interesting stuff and gets to the guts inside Javascript.
Kirupa,
I’m not sure how you would present this information in your next version of your book, but to me this seems like very fundamental information about Javascript ( and probably so much to explain the stuff you are trying to get across about renders in React in various chapters of your “Learning React” book ) that it seems to me somewhere somehow this should be information provided at some point to understand all this stuff.
While knowing about the event loop is good, I also wonder how much you really need to know about it. We didn’t care about it for years and only recently seemed to be paying any real amount of attention to it. I guess the fact that promises are such a big part of the language now that the need is greater given that they add a new layer to this cake… and yes, we’re doing a lot more with the language too, so it will come up more… fine we should know about it I was actually going to do a JS Tip of the Day topic on the event loop, but it was not something I thought I could explain very well in a “tip format”… though I understand a lot of those tips went above and beyond what they should have to a “tip format”.
@senocular. LOL. I have told a few others about your reply here and they have all LOL. also.
OK. So, for those who may be curious, here is pretty much a working version of what I was going for with this post. I tried to obfuscate the javascript after the npm build, so hopefully you cannot reverse engineer much of it to get the source code correct ( without learning what I did that is lol ). http://buchmanng313.macombserver.net/ReactCourse/highlowgame/build3/index.html
The video above was certainly the secret sauce to what I needed to get what I was looking for once you either guess the correct number, or the timer runs out.
If you surf around the website where this is, you can find the parts of the book I have completed so far, as well as all my Web Programming homework in the degree program I have complete thus far. Please don’t judge too harshly ;-). You can review my profile on this forum to get more information on who I am and what I trying to do here.
Finally, there are lots of things to add to this program, and I need to get to the SPA chapter 18 to add a few more items I wish to add to this program…
Add a starting page where the player can choose easy, medium, or hard, and then offer 0 to 999 ( easy ), 0 to 999,999 ( medium ), etc.
Add a max number of guesses even if time has not run out as another way the player could lose the game.
Add the to do list app type functionality where the last 5 guesses or whatever are shown in a rotating list below the current information of the webpage. The list would show each guess and the result ( higher or lower ). As the user adds another guess the oldest guess drops off and the newer guess shows on the top of the list of guesses and results.
Add more color and action, like have the clock ticks turn the timer yellow when the time gets below 10 seconds, and then red when the time gets below 5 seconds. More action when the correct guess is provided. All kinds of things to add here to make it better.
Oh well, the best thing about computer programs is that they are never completed or correct, they are all just works in progress that can get better and better.
I have a quote from somewhere… “Computer programs don’t actually function, they are only varying degrees of less broken.”
Finally, Finally, Kirupa.
Suggestion for the Book. Move Chapter 13 ( Build a React app - the “npm” Chapter as I call it ) move it to much earlier in the book.
The part I did not understand with the program was how setTimeout() worked. And also how render() was blocked by the javascript stack. I knew that javascript could stop a webpage from refreshing ( certainly there are plenty of slow webpages on the internet already ), and I was kinda sorta looking for that functionality, but the whole thing about the event loop and callback queue was completely new information to me.
Actually, I was looking for a way to cause a render(), and then stop the webpage from refreshing while the user got a chance to see if they guessed correctly or time ran out, etc. But instead, I found a way that I don’t have to stop the webpage from refreshing.
Basically, the way I figure it, is that we cannot “force” a render() in React. Instead we must wait for the javascript primary stack to clear, and then either the browser itself will re-render the page, or a state change in React will make it happen, or a timeout timer will go off ( I have it now coded ) and the callback queue and event loop will get what I want done ( this way is actually a bonus because the webpage is actually responsive while the timeout is ticking down - which is why item 4 ( fireworks of color on the webpage when you guess correctly ) ). Which is why we want to keep the javascript stack clear and have our React code work very fast, so that webpages look fluid and responsive.
I love the presenter in the video with the term “Next-ish” LOLOLOL.