What happens when Coderpad creates an interview session? - web

I am trying to understand on a high level how a system like coderpad works. Everytime I use Coderpad to practice interviews with friends, it creates a session with a temporary link that both users can access to start the coding interview.
When a someone goes to the homepage they would be served the standard html page/client for the homepage. When they create an interview session they are served the html page/client for the coding pad, and there must also be a way to users to connect to the same session and for each session to be an isolated instance? Im guessing that when each user use the link, the server process their request and based on the link, it actually set up a stream connection between the users so that they can collaborate on a shared document, share video/voice.
my questions are:
- how exactly is the temporary link created, and how can it be created so fast?
- is my understanding of how it works correct?
- Giving topics to look into that could point me in the right direction would really help

I got curious about this too, after an interview on CoderPad.io. I suspect the temporary links are just for the server to identify the session - not actual pages on the server. Probably using WebSocket to communicate between the server and clients, broadcasting back to all users whenever code is changed (or other events.)
The coding pad page is the same static HTML. The contents and users are modified on the back-end, and only the results are shown - like in a chatroom.
Hope this helps.

Related

Private api with expressjs and react?

So i am making a social media like site where i use react for frontend and expressjs for backend...
I was using public api till now but now i need private api to control some login info. So, i cannot understand how to do it. Because the link where it will request can be viewed by doing Ctrl+Shift+I and can be used by anyone
I still have methods to do but just wondering, if any way to know where does the request comming from
Let assume that the api site is api.some.site and the main site is some.site, so the request should only come from some.site else send 404 response and i need to do it with expressjs...
I don't know how to do it but I wanted to give you some information to think about. If you want people to be able to log in, on your site. That api end point has to be unprotected, because a logged out person does not have any credentials yet. When logged in the user would be able to access protected end points right? End points like password change of viewing specific pages. So all the data an user should or should not have access to should be handled by the server. You website is only a mechanism to make your data look pretty and easy to handle. So in a way you shouldn't care about people using your open end points from another location because their open anyways.
Authentication should never be handled client side. It should always be handled by a server.
This is my opinion, hope it helps. Sorry if it's not what you are looking for

How to change the content in real time using node js?

Have small app (My first Node js App), where I want add changing real-time content.
For example I have a common url which have list of content link, when user click on particular link it will open its correspondence link.
I have teacher and student role in the app so if teacher open the specific content(From the common url page) then it will automatically open that content for all student who have common url.
Please give me any Idea to implement this functionality and please tell me any plugin who have same functionality for real time content change.
One way, probably the easiest would be to use websockets, an easily manageable choice is socket.io npm package. What makes websockets different from http requests is the direction of the data flow. While http is pull based, meaning that a request has to be made to the server in order to get a response, websockets - once the connection is established - are or at least can be push based, meaning that the server could push out content without having to get a request from the client. In your situation, the teacher and the studens would all have an active websocket connection with the server. When the teacher clicked on a certain view, it would push the view’s data requirements to the students without any interaction from their side and the view would update on their screens according to the pushed data.
Look into how websockets work and try to experiment with a basic socket.io setup.

Can server side rendering in React be helpful with dynamic presentation?

My issue: For my thesis I am creating an auction site. I have an admin panel in which I would like to have some configurations so that an admin can specify that if there are 10 days before the end of an auction some components should be displayed in different ways, some should be not visible at all etc. That’s what I call dynamic presentation.
My question: Right now I am working on architecture and wondering if SSR can be helpful in any way? I am already aware that it can shorten download time of some collections from my database even by half, but I am wondering if there is any way how it can be helpful with dynamic presentation itself?
What I already know: I have read all about advantages and disadvantages of ssr or universal rendering in react. Now I am only wondering if it can be in any way helpful with dynamic presentation or it won't matter if I choose SSR or CSR.
Small side question: I don’t have the whole architecture ready yet. What I know is that I would like to have a database, one separate app for an admin, backend and frontend (either ssr or csr). My first thought on how to manage this dynamic presentation was to store some rules in the database. Then the rules could be configured in admin app should an admin want to change anything. The rules should be send to backend and calculated with some additional data from frontend. Then backend could send some flag to frontend indicating which components to display etc. In theory I could move calculating to e.g. NodeJs server should I go with SSR. What I'm wondering about is; can you think of any better way to handle dynamic presentation? What I am most afraid of is numerous ifs in the fronetend. I would like to have some more elegant solution but I have no other idea so far. For some time I thought about a scoring system but I believe it would be too complicated (instead of sending a flag, send a score and frontend will display correct things based on the score). Also it wouldn’t solve the issue of ifs on the frontend.
I am aware that on StackOverflow questions which can be answered rather than discussed are preferred but I am really stuck and would appreciate help.
Basically SSR can provide some speed on your page because all of your data will not be trying to be fetched when the react script will end with an API call. Data are fetched from database when page is requested and be passed to the component to render with the script.
Also another very basic advantage and the reason why everyone are going the SSR way is SEO. You cannot achieve SEO page with react CSR. This is because google bot etc will try and crawl your page without even render it. Is like trying to "view source" of a page. When you are in CSR the page has no content only the initial react divs empty. You need SSR to have data on the first request of the user.
SSR brings the data on the first request of the user until a reload. In the meantime react router fetches data from the api.
Let me know if that help you.
PS: also a helpful link https://medium.com/walmartlabs/the-benefits-of-server-side-rendering-over-client-side-rendering-5d07ff2cefe8

Iframe - access information workaround

I have site that is on another domain and iframe access will not work. The site on other domain is a questionnaire with series of questions. Once the questions are completed that site will give me a number.
My task is allow a user on my site to go over those questions and to be able to access that number.
How can I achieve that? I was thinking to spin up a node server and have it fetch the complete site and serve it to me, something like mediator. That way I will not have CORS issues.
Is it possible to stream the complete page along with css/js to my frontend (backbone app)? Run it in the window for the user. Upon completion it can send the answer back to node, so node can post it and return the number to me.
I am open to any suggestions :)

Node.js send variable to client

I have a small Node.js HTTP server that does requests to a mongo database (with the mongoose module).
What I want to do is query the database, store it in a variable (array) and send it to the client.
Because ideally, when the user clicks on one of the buttons on the html page, the JavaScript will pick-up the event and change the appearance of the website by showing calculations based on data that is stored in the database.
The only way I could come with was just "transferring" the database content to the client browser but if anyone can come with another solution that would be fine too !
So basically my question is :
How can I pass a variable from the Node.js server to the client browser when serving a page ?
Thank you in advance !
If you will be doing more than a couple of these types of transfers, I recommend looking into Socket.IO.
It's a layer that provides quick and easy communication between Node.js servers and web front-ends, by abstracting web sockets when available, and falling back to other transports (such as JSON-P or Flash) when it's not available. Basically, you would call io.emit('something', {yourdata: here}), and it is easily received on the other end. All of the serialization is done for you.
http://socket.io/
Give their demo a shot to see how it works.

Resources