{"id":34780,"date":"2023-08-24T13:46:50","date_gmt":"2023-08-24T20:46:50","guid":{"rendered":"https:\/\/coderpad.io\/?post_type=interview-questions&#038;p=34780"},"modified":"2024-06-26T08:01:44","modified_gmt":"2024-06-26T15:01:44","slug":"full-stack","status":"publish","type":"interview-questions","link":"https:\/\/coderpad.io\/interview-questions\/full-stack\/","title":{"rendered":"Full stack"},"content":{"rendered":"\n<p>The ever-elusive full stack developer has a unique understanding of both frontend and backend technologies that makes them a valuable member to just about any application team.<\/p>\n\n\n\n<blockquote class=\"wp-block-quote\">\n<p>According to the <a href=\"https:\/\/coderpad.io\/interview-questions\/backend-interview-questions\/\">CoderPad 2024 Developer survey<\/a>, full stack developers are THE most in-demand job role technical recruiters are looking to fill.<\/p>\n<\/blockquote>\n\n\n\n<p>The subsequent sections provide a set of practical coding assignments and interview questions crafted to evaluate a candidate&#8217;s skill in full stack development during technical interviews.<\/p>\n\n\n\n<p>Additionally, a collection of suggested best practices is included to ensure a reliable evaluation of applicants&#8217; full stack proficiency via your interview queries.<\/p>\n\n\n\n<div class=\"wp-block-rank-math-toc-block\" id=\"rank-math-toc\"><h2>Table of Contents<\/h2><nav aria-label=\"Table of Contents\"><ul><li><a href=\"#full-stack-example-question-1\">Full stack example question 1<\/a><ul><\/ul><\/li><li><a href=\"#full-stack-example-question-2\">Full stack example question 2<\/a><ul><\/ul><\/li><li><a href=\"#junior-full-stack-interview-questions\">Junior full stack interview questions<\/a><\/li><li><a href=\"#intermediate-full-stack-interview-questions\">Intermediate full stack interview questions<\/a><\/li><li><a href=\"#senior-full-stack-interview-questions\">Senior full stack interview questions<\/a><\/li><li><a href=\"#more-full-stack-interview-resources\">More full stack interview resources<\/a><\/li><li><a href=\"#best-interview-practices-for-full-stack-roles\">Best interview practices for full stack roles<\/a><\/li><\/ul><\/nav><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"full-stack-example-question-1\">Full stack example question 1<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"create-a-to-do-application\"><strong>Create a to-do application<\/strong><\/h3>\n\n\n\n<p>This question will examine candidates&#8217; ability to work on the frontend and backend of an application, as well as their ability to think about client side caching and data management, and how to handle optimistic mutations in an application that interacts with an API. It is broken into two parts \u2013 you can have the more senior candidates complete both; for more junior candidates you can use the second part as a bonus or stretch goal.<\/p>\n\n\n\n<p><strong>Part 1 instructions:<\/strong><\/p>\n\n\n\n<p><em>The functionality to add todos and mark them as completed or uncompleted already exists. Your task is to implement the ability to update the \u201cdescription\u201d field of a given todo in the database.<\/em><\/p>\n\n\n\n<p><strong>Part 2 instructions:<\/strong><\/p>\n\n\n\n<p><em>Next, implement optimistic updates for updating the \u201ccompleted\u201d and \u201cdescription\u201d fields for a given todo.&nbsp;<\/em><\/p>\n\n\n\n<p><em>When a user creates a todo, toggles a todo completeness, or updates a todo description, those updates should be made immediately in the frontend of the application, before the updates are saved in the database.&nbsp;<\/em><\/p>\n\n\n\n<p><em>If the API responds with a success status, then the frontend updates are allowed to persist. If the API responds with an error status, the frontend update must be reverted.<\/em><\/p>\n\n\n\n<p><em>Example:<\/em><\/p>\n\n\n\n<p><em>1. Todo with id 2 is marked as completed. The frontend immediately shows that todo as complete, despite the change having not been persisted in the database.<\/em><\/p>\n\n\n\n<p><em>2. The API responds with a 500 because todo 2 could not be saved.<\/em><\/p>\n\n\n\n<p><em>3. The frontend must now revert the change to todo 2 and show it as incomplete.<\/em><\/p>\n\n\n<div\n\tclass=\"sandbox-embed responsive-embed  sandbox-embed--full-width\"\n\tstyle=\"padding-top: 85%\"\ndata-block-name=\"coderpad-sandbox-embed\">\n\t<iframe src=\"https:\/\/embed.coderpad.io\/sandbox?question_id=257425u0026use_question_button\" width=\"640\" height=\"544\" loading=\"lazy\" aria-label=\"Try out the CoderPad sandbox\"><\/iframe>\n<\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"full-stack-example-question-2\">Full stack example question 2<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"improve-this-full-stack-mine-sweeper-game\"><strong>Improve this full-stack MineSweeper game<\/strong><\/h3>\n\n\n\n<p>This fun interview question allows you to analyze a candidate\u2019s ability to troubleshoot and enhance a UI and to work with databases that manage a user\u2019s progress.<\/p>\n\n\n\n<p>It\u2019s broken into three parts, each a little more complex than the previous one \u2013 so it\u2019s a great one to use if you&#8217;re looking for full-stack developers of multiple skill levels. You can have junior developers focus primarily on the first part and have the other two be \u201cstretch goals.\u201d&nbsp;<\/p>\n\n\n\n<p>Alternatively, you can have your senior developer candidates work on all three parts to see how they work with a more in-depth development task.<\/p>\n\n\n\n<p><strong>Part 1 instructions:<\/strong><\/p>\n\n\n\n<p><em>Welcome to my game, created with <\/em><a href=\"https:\/\/coderpad.io\/interview-questions\/nodejs-interview-questions\/\"><em>NodeJS<\/em><\/a><em> and <\/em><a href=\"https:\/\/coderpad.io\/interview-questions\/react-interview-questions\/\"><em>React<\/em><\/a><em>.<\/em><\/p>\n\n\n\n<p><em>To test it, go to the \u201cProgram Output\u201d tab, click \u201cStart a new game\u201d, then click on a tile to reveal it. Try to avoid mines!<\/em><\/p>\n\n\n\n<p><em>All the games and their current states are saved in the database. So you can start multiple games and play them in any order you like.<\/em><\/p>\n\n\n\n<p><em>However, the game engine lacks a cool feature. When you click on a tile which is marked with a \u201c0\u201d, you have to manually click all the tiles around. The original MineSweeper game would automatically reveal these tiles, as they are not dangerous. This automatic reveal could also trigger more automatic reveals, if some tiles are also marked as \u201c0\u201d, and so on.<\/em><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><a href=\"https:\/\/d2h1bfu6zrdxog.cloudfront.net\/wp-content\/uploads\/2023\/07\/img_64b9167c572b6.png\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"https:\/\/d2h1bfu6zrdxog.cloudfront.net\/wp-content\/uploads\/2023\/07\/img_64b9167c572b6.png\" alt=\"Two Minesweeper boards. On the left is a full board that says &quot;click once&quot;. In the middle is an arrow that has a label that says &quot;automatically reveal the &quot;0&quot; tiles&quot;. On the right is a minesweeper board that has some tiles revealed. \"\/><\/a><\/figure>\n<\/div>\n\n\n<p><em>Would you implement this feature for me, please?<\/em><\/p>\n\n\n\n<p><strong>Part 2 instructions:<\/strong><\/p>\n\n\n\n<p><em>This application is (quite) secure. The mines\u2019 positions are known only by the server. When the player clicks on a tile, a request is sent to the server, which answers only what is necessary:<\/em><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><em>A boolean telling if the tile has a mine,<\/em><\/li>\n\n\n\n<li><em>The number of mines around the tile.<\/em><\/li>\n<\/ul>\n\n\n\n<p><em>The problem is that the server may have to send more data, because multiple tiles may be revealed on a single click.<\/em><\/p>\n\n\n\n<p><em>Here are the first tasks you have to do:<\/em><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><em>On the client side, find the code that is executed when the player clicks on a tile. It is split in two places: the React component defining the user interface, and the client API.<\/em><\/li>\n\n\n\n<li><em>On the server side, find the code that reveals a tile and sends the response to the client. It is in the server API.<\/em><\/li>\n\n\n\n<li><em>Determine the current structure of the data exchanged between the client and the server.<\/em><\/li>\n\n\n\n<li><em>Decide on a new structure. It could be, for example, a boolean telling if there is a mine and a list of revealed tiles. This list could contain objects with coordinates (x, y) and the number of mines around it.<\/em><\/li>\n\n\n\n<li><em>Adapt all the code parts previously identified, so that they handle this new data structure.<\/em><\/li>\n\n\n\n<li><em>Modify the server-side code to automatically reveal the tiles which have 0 mines around. You may have to do a little recursivity, or store the tiles to process in a list, because the revealed tiles may propagate.<\/em><\/li>\n<\/ul>\n\n\n\n<p><strong>Part 3 instructions:<\/strong><\/p>\n\n\n\n<p><em>Oh\u2026 One last thing. There are some \u201csecurity flaws\u201d in the code. You can cheat and get some clues on the bomb positions, without revealing the tiles. Even if we consider a real situation where you would be only on the client side. Can you find these flaws?<\/em><\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"assessing-the-candidates-response\"><strong>Assessing the candidate\u2019s response<\/strong><\/h3>\n\n\n\n<p>You\u2019ll have your own criteria of what to look for in a full-stack developer, but here are some things we recommend looking out for when you\u2019re using this question to assess your candidates:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Is the candidate using comments to show their understanding of the code or to document how their code works?<\/li>\n\n\n\n<li>Is the candidate testing their code? Are they writing test cases for them? Or perhaps they\u2019re taking an iterative coding approach \u2013 writing sections of code and then testing its functionality as they go?<\/li>\n\n\n\n<li>Are they able to follow a systematic debugging approach?<\/li>\n\n\n\n<li>Is the candidate accurately understanding how the front-end and back-end services communicate with one another?<\/li>\n\n\n\n<li>Are they following best design practices with their front-end implementation?<\/li>\n<\/ul>\n\n\n<div\n\tclass=\"sandbox-embed responsive-embed  sandbox-embed--full-width\"\n\tstyle=\"padding-top: 85%\"\ndata-block-name=\"coderpad-sandbox-embed\">\n\t<iframe src=\"https:\/\/embed.coderpad.io\/sandbox?question_id=257406u0026use_question_button\" width=\"640\" height=\"544\" loading=\"lazy\" aria-label=\"Try out the CoderPad sandbox\"><\/iframe>\n<\/div>\n\n\n<section class=\"\n\ticon-lists-block\n\t\n\" data-block-name=\"coderpad-icon-lists-block\">\n    <div class=\"inner\">\n\n    \n            <div class=\"lists lists--2\">\n                            <div class=\"icon-list\">\n        <div class=\"top\">\n                            <div class=\"icon-container\">\n                    <svg class=\"icon icon-lightning-bolt\" role=\"img\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"none\" viewBox=\"0 0 10 14\"><title>lightning bolt<\/title><path fill=\"currentColor\" d=\"M3.608 13.967c.185.079.4.013.508-.158l4.922-7.82a.41.41 0 0 0-.347-.63H5.407L6.628.511a.41.41 0 0 0-.744-.32L.962 8.011a.41.41 0 0 0 .347.63h3.284l-1.221 4.848a.41.41 0 0 0 .236.478Z\"\/><\/svg>\n\n                <\/div>\n            \n                            <h3 class=\"title\">Full stack skills to assess<\/h3>\n                    <\/div>\n\n                    <ul class=\"links\">\n                                    <li>\n                        <a >Frontend frameworks<\/a>\n                    <\/li>\n                                    <li>\n                        <a >Backend frameworks<\/a>\n                    <\/li>\n                                    <li>\n                        <a >Databases<\/a>\n                    <\/li>\n                                    <li>\n                        <a >HTTP u0026 REST<\/a>\n                    <\/li>\n                            <\/ul>\n        <\/div>\n\n                            <div class=\"icon-list\">\n        <div class=\"top\">\n                            <div class=\"icon-container\">\n                    <svg class=\"icon icon-briefcase\" role=\"img\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 25 26\" fill=\"none\"><title>briefcase<\/title><path fill=\"currentColor\" d=\"M5.469 16.125a5.446 5.446 0 0 1-3.907-1.648v6.335a2.35 2.35 0 0 0 2.344 2.344h17.188a2.35 2.35 0 0 0 2.343-2.343v-6.336a5.446 5.446 0 0 1-3.906 1.648H5.47Z\"\/><path fill=\"currentColor\" d=\"M21.094 5.969h-3.125v-.782a2.344 2.344 0 0 0-2.344-2.343h-6.25a2.344 2.344 0 0 0-2.344 2.344v.78H3.906a2.35 2.35 0 0 0-2.344 2.345v2.343a3.906 3.906 0 0 0 3.907 3.906h2.343V12.22a.781.781 0 1 1 1.563 0v2.344h6.25v-2.344a.781.781 0 1 1 1.563 0v2.344h2.343a3.907 3.907 0 0 0 3.907-3.907V8.312a2.351 2.351 0 0 0-2.344-2.343Zm-12.5-.782a.781.781 0 0 1 .781-.78h6.25a.781.781 0 0 1 .781.78v.782H8.594v-.782Z\"\/><\/svg>\n\n                <\/div>\n            \n                            <h3 class=\"title\">Full stack job roles<\/h3>\n                    <\/div>\n\n                    <ul class=\"links\">\n                                    <li>\n                        <a >Full stack developer<\/a>\n                    <\/li>\n                                    <li>\n                        <a >Software engineer<\/a>\n                    <\/li>\n                                    <li>\n                        <a >Web developer<\/a>\n                    <\/li>\n                            <\/ul>\n        <\/div>\n\n                    <\/div>\n    \n    <\/div>\n<\/section>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"junior-full-stack-interview-questions\">Junior full stack interview questions<\/h2>\n\n\n\n<p><strong>Question:<\/strong> What is the difference between a relational database and a NoSQL database?<\/p>\n\n\n\n<p><strong>Answer:<\/strong> A relational database uses tables with predefined schemas to store data and relationships. They are based on the relational model and often use SQL (Structured Query Language) for querying. Examples include MySQL, PostgreSQL, and Oracle. On the other hand, NoSQL databases don&#8217;t use a fixed schema and can store data in various ways &#8211; document, key-value, columnar, graph. They&#8217;re designed for scalability and flexibility. Examples include MongoDB (document-based), Redis (key-value), and Neo4j (graph-based).<\/p>\n\n\n\n<p><strong>Question:<\/strong> Explain the concept of MVC in web development.<\/p>\n\n\n\n<p><strong>Answer:<\/strong> MVC stands for Model-View-Controller. It&#8217;s a design pattern used in web development to separate an application into three interconnected components:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Model:<\/strong> Represents the data structure and the business logic of the application.<\/li>\n\n\n\n<li><strong>View:<\/strong> Handles the presentation and the UI part of the application.<\/li>\n\n\n\n<li><strong>Controller:<\/strong> Manages user requests and acts as an interface between Model and View.<\/li>\n<\/ul>\n\n\n\n<p><strong>Question:<\/strong> How does a RESTful API work and why is it popular in web development?<\/p>\n\n\n\n<p><strong>Answer:<\/strong> A RESTful API (Representational State Transfer) is an architectural style for designing networked applications. It uses a stateless, client-server communication model, where each request from the client contains all the information needed for the server to fulfill that request.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<p>Interacting with REST applications often involves the use of CRUD-like functions. Create, Read, Update, and Delete \u2014 or CRUD \u2014 are the four major functions used to interact with database applications.<\/p>\n\n\n\n<p>There is an (approximate) correspondance between HTTP methods and CRUD functions:<\/p>\n\n\n\n<p>CRUD&nbsp;&nbsp; | HTTP<br>&#8212;&#8212;-|&#8212;&#8212;&#8212;&#8212;&#8212;&#8211;<br>CREATE | POST\/PUT<br>READ&nbsp;&nbsp; | GET<br>UPDATE | PUT\/POST\/PATCH<br>DELETE | DELETE<\/p>\n\n\n\n<p><strong>Question:<\/strong> Review the following Express.js code and explain what it does:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-1\" data-shcb-language-name=\"PHP\" data-shcb-language-slug=\"php\"><span><code class=\"hljs language-php shcb-wrap-lines\">   <span class=\"hljs-keyword\">const<\/span> express = <span class=\"hljs-keyword\">require<\/span>(<span class=\"hljs-string\">'express'<\/span>);\n   <span class=\"hljs-keyword\">const<\/span> app = express();\n\n   app.get(<span class=\"hljs-string\">'\/hello'<\/span>, (req, res) =&gt; {\n      res.send(<span class=\"hljs-string\">'Hello, World!'<\/span>);\n   });\n\n   app.listen(<span class=\"hljs-number\">3000<\/span>);<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-1\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">PHP<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">php<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><strong>Answer:<\/strong> The code initializes an Express.js server. When a GET request is made to the <code>\/hello<\/code> endpoint, the server responds with &#8220;Hello, World!&#8221;. The server listens on port 3000.<\/p>\n\n\n\n<p><strong>Question:<\/strong> Given the following HTML file, identify the issue. We consider the file &#8220;jquery.min.js&#8221; exists and contains an updated version of jQuery.<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-2\" data-shcb-language-name=\"HTML, XML\" data-shcb-language-slug=\"xml\"><span><code class=\"hljs language-xml shcb-wrap-lines\"><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">head<\/span>&gt;<\/span>\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">script<\/span> <span class=\"hljs-attr\">src<\/span>=<span class=\"hljs-string\">\"jquery.min.js\"<\/span>&gt;<\/span><span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">script<\/span>&gt;<\/span>\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">script<\/span>&gt;<\/span><span class=\"javascript\">\n        $(<span class=\"hljs-string\">'#myButton'<\/span>).click(<span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span>(<span class=\"hljs-params\"><\/span>) <\/span>{\n            alert(<span class=\"hljs-string\">'Button clicked!'<\/span>);\n        });\n    <\/span><span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">script<\/span>&gt;<\/span>\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">head<\/span>&gt;<\/span>\n\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">body<\/span>&gt;<\/span>\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">button<\/span> <span class=\"hljs-attr\">id<\/span>=<span class=\"hljs-string\">\"myButton\"<\/span>&gt;<\/span>Click me<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">button<\/span>&gt;<\/span>\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">body<\/span>&gt;<\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-2\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">HTML, XML<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">xml<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><strong>Answer:<\/strong> At a first glance, the code seems to bind a click event to the button with the ID <code>myButton<\/code> and it will display an alert when clicked. The issue is that the script runs before the button element is rendered in the DOM. So, the event binding will not work. To fix this, the code should be wrapped in a <code>$(document).ready()<\/code> function or be placed before the closing <code>&lt;\/body&gt;<\/code> tag.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<p><strong>Question:<\/strong> This Node.js code logs &#8220;undefined&#8221; on the console instead of the content of the file. Can you explain why?<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-3\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-wrap-lines\"><span class=\"hljs-keyword\">const<\/span> fs = <span class=\"hljs-built_in\">require<\/span>(<span class=\"hljs-string\">'fs'<\/span>);\n<span class=\"hljs-keyword\">var<\/span> content;\nfs.readFile(<span class=\"hljs-string\">'my_file.txt'<\/span>, (err, data) =&gt; {\n    <span class=\"hljs-keyword\">if<\/span> (err) {\n        <span class=\"hljs-keyword\">throw<\/span> err;\n    }\n    content = data;\n});\n<span class=\"hljs-built_in\">console<\/span>.log(content);<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-3\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><strong>Answer:<\/strong> The arrow function expression passed in parameter to&nbsp;<code>readFile<\/code>&nbsp;is an asynchronous callback. It doesn&#8217;t execute right away, but it executes when the file loading has completed. When calling readFile, the execution continues immediately to the next line of code. So when console.log is called, the callback has not yet been invoked, and this content has not yet been set.<\/p>\n\n\n\n<p>To handle this specific case of reading a file and logging its content, the best solution is to use the function&nbsp;<code>fs.readFileSync<\/code>, which is the synchronous version of&nbsp;<code>readFile<\/code>.<\/p>\n\n\n\n<p><strong>Question:<\/strong> Given the following frontend code, identify any issues:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-4\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-wrap-lines\">   fetch(<span class=\"hljs-string\">'\/api\/data'<\/span>)\n      .then(<span class=\"hljs-function\"><span class=\"hljs-params\">response<\/span> =&gt;<\/span> response.json())\n      .then(<span class=\"hljs-function\"><span class=\"hljs-params\">data<\/span> =&gt;<\/span> <span class=\"hljs-built_in\">console<\/span>.log(data))\n      .catch(<span class=\"hljs-function\"><span class=\"hljs-params\">error<\/span> =&gt;<\/span> <span class=\"hljs-built_in\">console<\/span>.error(<span class=\"hljs-string\">'Error fetching data:'<\/span>, error));<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-4\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><strong>Answer:<\/strong> The code fetches data from the <code>\/api\/data<\/code> endpoint and logs it to the console. One potential oversight is that it assumes a successful HTTP response contains valid JSON. It&#8217;s a good practice to first check <code>response.ok<\/code> before parsing the JSON to handle potential server errors.<\/p>\n\n\n\n<p><strong>Question:<\/strong> Describe the importance of CORS in web development.<\/p>\n\n\n\n<p><strong>Answer:<\/strong> CORS (Cross-Origin Resource Sharing) is a security feature implemented by web browsers that controls how web pages in one domain can request resources from another domain. Without CORS, the Same-Origin Policy would prevent AJAX requests to different domains. For APIs and services to be accessed from different origins (domains, protocols, or ports), the server needs to include appropriate CORS headers (like <code>Access-Control-Allow-Origin<\/code>) in its response to permit these cross-origin requests.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"intermediate-full-stack-interview-questions\">Intermediate full stack interview questions<\/h2>\n\n\n\n<p><strong>Question:<\/strong> What are JWTs, and why are they commonly used in web applications?<\/p>\n\n\n\n<p><strong>Answer:<\/strong> JWT (JSON Web Token) is a compact URL-safe means of representing claims to be transferred between two parties. It&#8217;s typically used for authentication and authorization. Once a user logs in, the server can generate a JWT that encodes certain claims, and this token can be sent to the client for storage and included with subsequent requests to authenticate the user.<\/p>\n\n\n\n<p><strong>Question:<\/strong> Explain the importance and role of WebSockets in modern web applications.<\/p>\n\n\n\n<p><strong>Answer:<\/strong> WebSockets provide a full-duplex communication channel over a single, long-lived connection, enabling real-time functionality. It&#8217;s more efficient than traditional polling mechanisms and is commonly used in applications that need constant data updates like chat apps, online games, and financial platforms.<\/p>\n\n\n\n<p><strong>Question:<\/strong> Describe the benefits and drawbacks of using a microservices architecture.<\/p>\n\n\n\n<p><strong>Answer:<\/strong><br><em>Benefits<\/em><strong>:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Scalability:<\/strong> Individual components can be scaled independently.<\/li>\n\n\n\n<li><strong>Flexibility in technology:<\/strong> Different services can use different technologies suited to their needs.<\/li>\n\n\n\n<li><strong>Easier deployment &amp; fault isolation:<\/strong> A failure in one service doesn&#8217;t mean the whole system goes down. <\/li>\n<\/ul>\n\n\n\n<p><em>Drawbacks<\/em><strong>:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Complexity:<\/strong> More services can mean more complexity in terms of deployment, monitoring, and management.<\/li>\n\n\n\n<li><strong>Network latency:<\/strong> Increased communication between services can introduce latency.<\/li>\n\n\n\n<li><strong>Data consistency:<\/strong> With data often split among different services, maintaining data consistency can be challenging.<\/li>\n<\/ul>\n\n\n\n<p><strong>Question:<\/strong> Analyze the following <code>Dockerfile<\/code> and identify its purpose:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-5\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-wrap-lines\">   FROM node:<span class=\"hljs-number\">14<\/span>\n\n   WORKDIR \/usr\/src\/app\n\n   COPY package*.json .\/\n\n   RUN npm install\n\n   COPY . .\n\n   EXPOSE <span class=\"hljs-number\">8080<\/span>\n\n   CMD &#91;<span class=\"hljs-string\">\"npm\"<\/span>, <span class=\"hljs-string\">\"start\"<\/span>]<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-5\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><strong>Answer:<\/strong> This <code>Dockerfile<\/code> describes how to create a Docker image for a Node.js application. It starts with an official Node.js image (version 14). It sets the working directory in the container to <code>\/usr\/src\/app<\/code>. It then copies the <code>package.json<\/code> and <code>package-lock.json<\/code> (if available) files into the container. After that, it runs <code>npm install<\/code> to install the application&#8217;s dependencies. It then copies the rest of the application into the container. The application seems to run on port 8080 as it&#8217;s exposed. Finally, it specifies the command to run when the container starts, which is <code>npm start<\/code>.<\/p>\n\n\n\n<p><strong>Question:<\/strong> Given the following React code, identify potential issues:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-6\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-wrap-lines\">   <span class=\"hljs-class\"><span class=\"hljs-keyword\">class<\/span> <span class=\"hljs-title\">MyComponent<\/span> <span class=\"hljs-keyword\">extends<\/span> <span class=\"hljs-title\">React<\/span>.<span class=\"hljs-title\">Component<\/span> <\/span>{\n      render() {\n         <span class=\"hljs-keyword\">return<\/span> (\n            <span class=\"xml\"><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span>&gt;<\/span>\n               {this.props.items.map(item =&gt; <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">p<\/span> <span class=\"hljs-attr\">key<\/span>=<span class=\"hljs-string\">{item.id}<\/span>&gt;<\/span>{item.name}<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">p<\/span>&gt;<\/span>)}\n            <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span><\/span>\n         );\n      }\n   }<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-6\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><strong>Answer:<\/strong> At a glance, the code seems to be okay as it correctly uses the <code>key<\/code> prop when mapping through items. However, potential issues might include:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>No type checking for <code>this.props.items<\/code>. Using PropTypes or TypeScript could ensure <code>items<\/code> is always an array.<\/li>\n\n\n\n<li>No checks for the existence or length of <code>this.props.items<\/code>, which might be important for handling empty states or preventing errors if <code>items<\/code> isn&#8217;t passed.<\/li>\n<\/ul>\n\n\n\n<p><strong>Question:<\/strong> Review the following Express middleware function and explain its purpose:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-7\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-wrap-lines\">   app.use(<span class=\"hljs-function\">(<span class=\"hljs-params\">req, res, next<\/span>) =&gt;<\/span> {\n      <span class=\"hljs-keyword\">if<\/span> (!req.headers.authorization) {\n         <span class=\"hljs-keyword\">return<\/span> res.status(<span class=\"hljs-number\">401<\/span>).send(<span class=\"hljs-string\">'Unauthorized'<\/span>);\n      }\n      next();\n   });<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-7\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><strong>Answer:<\/strong> This is an Express middleware that checks if the incoming request has an <code>authorization<\/code> header. If the header is missing, it responds with a 401 (Unauthorized) status and the message &#8216;Unauthorized&#8217;. If the header exists, it proceeds to the next middleware or route handler.<\/p>\n\n\n\n<p><strong>Question:<\/strong> Explain the following Sequelize model definition:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-8\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-wrap-lines\">   <span class=\"hljs-keyword\">const<\/span> User = sequelize.define(<span class=\"hljs-string\">'User'<\/span>, {\n      <span class=\"hljs-attr\">username<\/span>: {\n         <span class=\"hljs-attr\">type<\/span>: Sequelize.STRING,\n         <span class=\"hljs-attr\">unique<\/span>: <span class=\"hljs-literal\">true<\/span>\n      },\n      <span class=\"hljs-attr\">password_hash<\/span>: Sequelize.STRING\n   });<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-8\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><strong>Answer:<\/strong> This code defines a Sequelize model for a <code>User<\/code> with two fields: <code>username<\/code> and <code>password<\/code>_hash. Both fields are strings. The <code>username<\/code> field has an additional constraint, making it unique, which means every user must have a distinct username.<\/p>\n\n\n\n<p><strong>Question:<\/strong> Given the following frontend JavaScript code, explain the problem and how to solve it:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-9\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-wrap-lines\">   <span class=\"hljs-keyword\">async<\/span> <span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">fetchData<\/span>(<span class=\"hljs-params\"><\/span>) <\/span>{\n      <span class=\"hljs-keyword\">let<\/span> data = <span class=\"hljs-keyword\">await<\/span> fetch(<span class=\"hljs-string\">'\/api\/data'<\/span>);\n      <span class=\"hljs-keyword\">let<\/span> json = <span class=\"hljs-keyword\">await<\/span> data.json();\n      <span class=\"hljs-built_in\">console<\/span>.log(json);\n   }\n\n   fetchData();<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-9\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><strong>Answer:<\/strong> The code fetches data from the <code>\/api\/data<\/code> endpoint and logs the resulting JSON. <\/p>\n\n\n\n<p>Potential issues include: No error handling. If the fetch request fails (e.g., network issues, invalid JSON, server errors), the code could throw an unhandled promise rejection. To solve this, use a try-catch block inside the <code>fetchData<\/code> function to handle potential errors gracefully. Also, it&#8217;s better to use&nbsp;<code>const<\/code>&nbsp;keywords instead of&nbsp;<code>let<\/code>, as the declared variable are initialized only once and never modified after.<\/p>\n\n\n\n<p><strong>Question:<\/strong> Explain the difference between horizontal and vertical scaling in cloud computing.<\/p>\n\n\n\n<p><strong>Answer:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Horizontal scaling (scaling out\/in):<\/strong> Involves adding more machines to or removing machines from the existing pool. It can cater to increased traffic or reduce cost when traffic is low.<\/li>\n\n\n\n<li><strong>Vertical scaling (scaling up\/down):<\/strong> Involves adding more power (CPU, RAM) to an existing machine. It can improve the performance of a single instance but has an upper limit based on the machine&#8217;s max capabilities.<\/li>\n<\/ul>\n\n\n\n<p><strong>Question:<\/strong> What is the main difference between <code>GraphQL<\/code> and <code>REST<\/code> when designing APIs, and why might you choose one over the other?<\/p>\n\n\n\n<p><strong>Answer:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>REST (Representational State Transfer):<\/strong> A set of architectural principles where data and functionality are addressed via endpoints corresponding to specific resources. Client-server communication is stateless.<\/li>\n\n\n\n<li><strong>GraphQL:<\/strong> A query language for APIs, allowing clients to request only the data they need. It provides a more flexible structure that lets the client shape the response based on its requirements. You might choose <code>GraphQL<\/code> over <code>REST<\/code> if you want to give clients more flexibility in their data requests, reduce over-fetching or under-fetching of data, and potentially reduce the number of requests made. However, you might stick with <code>REST<\/code> if you have a simple application, are working with systems\/tools that integrate better with REST, or if you want to maintain a clear separation between API endpoints.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"senior-full-stack-interview-questions\">Senior full stack interview questions<\/h2>\n\n\n\n<p><strong>Question:<\/strong> Describe the concept of CQRS and its benefits in software architecture.<br><strong>Answer:<\/strong> CQRS stands for Command Query Responsibility Segregation. It&#8217;s a pattern where the data modification (command) and data retrieval (query) operations are separated. Benefits include<strong>:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><em>Scalability<\/em>: Since read and write operations can be scaled independently.<\/li>\n\n\n\n<li><em>Flexibility<\/em>: Allows for optimizing read and write sides for their specific operations and workload.<\/li>\n\n\n\n<li><em>Improved security:<\/em> Since command and query can have different security models.<\/li>\n\n\n\n<li><em>Simplified code<\/em>: Each side can be optimized for its primary function.<\/li>\n<\/ul>\n\n\n\n<p><strong>Question:<\/strong> Explain the importance of design patterns in software engineering and provide an example of one you have used.<br><strong>Answer:<\/strong> Design patterns are proven solutions to common software design problems. They offer:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><em>Reusability<\/em>: Since they are proven solutions, developers can incorporate them without reinventing the wheel.<\/li>\n\n\n\n<li><em>Communication<\/em>: Familiar patterns can help developers communicate design concepts quickly.<\/li>\n\n\n\n<li><em>Best practices<\/em>: Patterns encapsulate the best practices and help maintain code consistency. <\/li>\n\n\n\n<li>Example: The Singleton pattern ensures that a class has only one instance and provides a global point to access it, ensuring that resources are used efficiently.<\/li>\n<\/ul>\n\n\n\n<p><strong>Question:<\/strong> Examine the following Redux reducer and identify potential improvements:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-10\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-wrap-lines\">   <span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">todoReducer<\/span>(<span class=\"hljs-params\">state = &#91;], action<\/span>) <\/span>{\n      <span class=\"hljs-keyword\">if<\/span> (action.type === <span class=\"hljs-string\">'ADD_TODO'<\/span>) {\n         <span class=\"hljs-keyword\">return<\/span> state.concat(action.payload);\n      }\n      <span class=\"hljs-keyword\">return<\/span> state;\n   }<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-10\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><strong>Answer:<\/strong> The reducer handles an <code>ADD_TODO<\/code> action by concatenating the payload to the current state. Improvements might include:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Using the spread operator for clarity: <code>return [...state, action.payload];<\/code>.<\/li>\n\n\n\n<li>Handling more actions or adding a default case to explicitly state that the action isn&#8217;t recognized.<\/li>\n\n\n\n<li>Ensuring that action payloads are always structured correctly or validated before use.<\/li>\n<\/ul>\n\n\n\n<p><strong>Question:<\/strong> How would you prevent SQL injection attacks in a backend application?<\/p>\n\n\n\n<p><strong>Answer:<\/strong> SQL injection attacks can be prevented by:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Using prepared statements or parameterized queries, which ensure data is treated as input and not executable code.<\/li>\n\n\n\n<li>Escaping user input before using it in SQL queries.<\/li>\n\n\n\n<li>Avoiding the construction of dynamic SQL queries using string concatenation with unfiltered user input.<\/li>\n\n\n\n<li>Implementing proper error handling so that database errors are not revealed to the end user.<\/li>\n\n\n\n<li>Using ORM (Object Relational Mapping) libraries that often provide built-in protections against SQL injections.<\/li>\n<\/ul>\n\n\n\n<p><strong>Question:<\/strong> Analyze the following GraphQL query:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-11\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-wrap-lines\">   {\n      user(id: <span class=\"hljs-string\">\"12345\"<\/span>) {\n         name\n         email\n         friends {\n            name\n         }\n      }\n   }<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-11\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><strong>Answer:<\/strong> This GraphQL query fetches a user with the ID &#8220;12345&#8221;. For this user, it retrieves their name, email, and the names of all their friends.<\/p>\n\n\n\n<p><strong>Question:<\/strong> Given this configuration for a Kubernetes deployment, point out any areas of improvement:<\/p>\n\n\n<pre class=\"wp-block-code\"><span><code class=\"hljs shcb-wrap-lines\">   apiVersion: apps\/v1\n   kind: Deployment\n   metadata:\n      name: my-app\n   spec:\n      replicas: 3\n      template:\n         spec:\n            containers:\n            - name: my-container\n              image: my-app:latest\n              ports:\n              - containerPort: 8080<\/code><\/span><\/pre>\n\n\n<p><strong>Answer:<\/strong> Potential areas of improvement include:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Instead of using the <code>latest<\/code> tag for the image, it&#8217;s better to use specific version tags to ensure consistency across deployments.<\/li>\n\n\n\n<li>Configurable parameters (like image version or replica count) could be moved to a ConfigMap or Secret for better maintainability and security.<\/li>\n\n\n\n<li>Liveness and readiness probes could be added to the container configuration to ensure the application is running smoothly and traffic is only sent when the app is ready.<\/li>\n\n\n\n<li>Resource limits and requests might be specified to ensure that the container gets the required resources.<\/li>\n<\/ul>\n\n\n\n<p><strong>Question:<\/strong> Describe the Event Sourcing pattern and its advantages in application architecture.<\/p>\n\n\n\n<p><strong>Answer:<\/strong> Event Sourcing is a pattern where state changes of a system are stored as a sequence of events rather than just the current state. These events can be replayed to recreate the system&#8217;s state. Advantages include<strong>:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Audit Trail:<\/strong> Since all changes are stored, it provides a full history of actions.<\/li>\n\n\n\n<li><strong>Flexibility:<\/strong> Allows for temporal querying and recreating historical states.<\/li>\n\n\n\n<li><strong>Reliability:<\/strong> Helps in scenarios where system failures require state recovery.<\/li>\n<\/ul>\n\n\n\n<p><strong>Question:<\/strong> What&#8217;s the difference between optimistic and pessimistic concurrency control?<\/p>\n\n\n\n<p><strong>Answer:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Optimistic Concurrency Control:<\/strong> Assumes conflicts are rare. It allows multiple transactions to proceed and checks for conflicts at commit time. If a conflict is found, the transaction might be rolled back.<\/li>\n\n\n\n<li><strong>Pessimistic Concurrency Control:<\/strong> Assumes conflicts will happen. It locks records for a transaction, preventing others from accessing\/modifying them until the transaction is done.<\/li>\n<\/ul>\n\n\n\n<p><strong>Question:<\/strong> How do you approach performance optimization in large-scale web applications?<\/p>\n\n\n\n<p><strong>Answer:<\/strong> Performance optimization in large-scale applications can be approached in various ways, including:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Profiling and monitoring the application to identify bottlenecks.<\/li>\n\n\n\n<li>Implementing caching strategies (e.g., Redis, CDN).<\/li>\n\n\n\n<li>Optimizing database queries and indexing.<\/li>\n\n\n\n<li>Minimizing and bundling frontend assets (CSS, JS).<\/li>\n\n\n\n<li>Implementing server-side rendering for faster initial page loads.<\/li>\n\n\n\n<li>Using content delivery networks (CDN) to distribute assets closer to users.<\/li>\n\n\n\n<li>Load testing to identify and fix scaling issues before they impact users.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"more-full-stack-interview-resources\">More full stack interview resources<\/h2>\n\n\n\n<p>For more guides on improving your knowledge of full stack hiring, we have outlined helpful blog posts below:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/coderpad.io\/blog\/interviewing\/2-effective-interview-questions-to-ask-your-full-stack-developer-candidates\/\">2 Effective Interview Questions to Ask Your Full-Stack Developer Candidates<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/coderpad.io\/blog\/hiring-developers\/how-to-find-hire-web-developer\/\" target=\"_blank\" rel=\"noreferrer noopener\">2023 Web Developer Hiring: Expert Strategies for Finding the Right Fit<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/coderpad.io\/blog\/interviewing\/3-interview-tips-for-software-engineer-hiring-managers\/\">3 Interview Tips for Software Engineer Hiring Managers<\/a><\/li>\n<\/ul>\n\n\n\n<p><\/p>\n\n\n<section class=\"logo-row-block\">\n    <div class=\"inner\">\n                    <h2 class=\"headline\">1,000 Companies use CoderPad to Screen and Interview Developers<\/h2>\n        \n                    <div class=\"logos logos--grayscale\" >\n                                    <div>    <svg class=\"logo logo-spotify\" role=\"img\" viewBox=\"0 0 538 167\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><title>Spotify<\/title><path d=\"M83.743 0C37.494 0 0 37.493 0 83.742c0 46.251 37.494 83.741 83.743 83.741 46.254 0 83.744-37.49 83.744-83.741 0-46.246-37.49-83.738-83.745-83.738L83.743 0zm38.404 120.78a5.217 5.217 0 0 1-7.18 1.73c-19.662-12.01-44.414-14.73-73.564-8.07a5.222 5.222 0 0 1-6.249-3.93 5.213 5.213 0 0 1 3.926-6.25c31.9-7.288 59.263-4.15 81.337 9.34 2.46 1.51 3.24 4.72 1.73 7.18zm10.25-22.802c-1.89 3.072-5.91 4.042-8.98 2.152-22.51-13.836-56.823-17.843-83.448-9.761-3.453 1.043-7.1-.903-8.148-4.35a6.538 6.538 0 0 1 4.354-8.143c30.413-9.228 68.222-4.758 94.072 11.127 3.07 1.89 4.04 5.91 2.15 8.976v-.001zm.88-23.744c-26.99-16.031-71.52-17.505-97.289-9.684-4.138 1.255-8.514-1.081-9.768-5.219a7.835 7.835 0 0 1 5.221-9.771c29.581-8.98 78.756-7.245 109.83 11.202a7.823 7.823 0 0 1 2.74 10.733c-2.2 3.722-7.02 4.949-10.73 2.739h-.004zm94.56 3.072c-14.46-3.448-17.03-5.868-17.03-10.953 0-4.804 4.52-8.037 11.25-8.037 6.52 0 12.98 2.455 19.76 7.509.2.153.46.214.71.174a.933.933 0 0 0 .63-.386l7.06-9.952a.95.95 0 0 0-.18-1.288c-8.07-6.473-17.15-9.62-27.77-9.62-15.61 0-26.52 9.369-26.52 22.774 0 14.375 9.41 19.465 25.67 23.394 13.83 3.187 16.17 5.857 16.17 10.629 0 5.29-4.72 8.58-12.32 8.58-8.44 0-15.33-2.85-23.03-9.51a.98.98 0 0 0-.69-.23c-.26.02-.49.14-.65.33l-7.92 9.42c-.33.4-.29.98.09 1.32 8.96 8 19.98 12.22 31.88 12.22 16.82 0 27.69-9.19 27.69-23.42.03-12.007-7.16-18.657-24.77-22.941l-.03-.013zm62.86-14.26c-7.29 0-13.27 2.872-18.21 8.757v-6.624a.945.945 0 0 0-.94-.949h-12.95c-.52 0-.94.426-.94.949v73.601c0 .52.42.95.94.95h12.95c.52 0 .94-.43.94-.95v-23.23c4.94 5.53 10.92 8.24 18.21 8.24 13.55 0 27.27-10.43 27.27-30.369.02-19.943-13.7-30.376-27.26-30.376l-.01.001zm12.21 30.375c0 10.149-6.25 17.239-15.21 17.239-8.85 0-15.53-7.41-15.53-17.239 0-9.83 6.68-17.238 15.53-17.238 8.81-.001 15.21 7.247 15.21 17.237v.001zm50.21-30.375c-17.45 0-31.12 13.436-31.12 30.592 0 16.972 13.58 30.262 30.91 30.262 17.51 0 31.22-13.39 31.22-30.479 0-17.031-13.62-30.373-31.01-30.373v-.002zm0 47.714c-9.28 0-16.28-7.46-16.28-17.344 0-9.929 6.76-17.134 16.07-17.134 9.34 0 16.38 7.457 16.38 17.351 0 9.927-6.8 17.127-16.17 17.127zm68.27-46.53h-14.25V49.664a.944.944 0 0 0-.94-.948h-12.95c-.52 0-.95.426-.95.948V64.23h-6.22c-.52 0-.94.426-.94.949v11.127c0 .522.42.949.94.949h6.22v28.795c0 11.63 5.79 17.53 17.22 17.53 4.64 0 8.49-.96 12.12-3.02.3-.16.48-.48.48-.82v-10.6c0-.32-.17-.63-.45-.8a.918.918 0 0 0-.92-.04c-2.49 1.25-4.9 1.83-7.6 1.83-4.15 0-6.01-1.89-6.01-6.11V77.26h14.25c.52 0 .94-.426.94-.949V65.185a.918.918 0 0 0-.93-.949l-.01-.006zm49.64.057v-1.789c0-5.263 2.02-7.61 6.54-7.61 2.7 0 4.87.536 7.3 1.346.3.094.61.047.85-.132a.94.94 0 0 0 .39-.77v-10.91a.937.937 0 0 0-.67-.909c-2.56-.763-5.84-1.546-10.76-1.546-11.95 0-18.28 6.734-18.28 19.467v2.74h-6.22c-.52 0-.95.426-.95.948v11.184c0 .522.43.949.95.949h6.22v44.405c0 .53.43.95.95.95h12.94c.53 0 .95-.42.95-.95V77.258h12.09l18.52 44.402c-2.1 4.66-4.17 5.59-6.99 5.59-2.28 0-4.69-.68-7.14-2.03a1.03 1.03 0 0 0-.75-.07c-.25.09-.46.27-.56.51l-4.39 9.63c-.21.46-.03.99.41 1.23 4.58 2.48 8.71 3.54 13.82 3.54 9.56 0 14.85-4.46 19.5-16.44l22.46-58.037a.925.925 0 0 0-.1-.881.924.924 0 0 0-.77-.412h-13.48c-.41 0-.77.257-.9.636l-13.81 39.434-15.12-39.46a.944.944 0 0 0-.88-.61h-22.12v-.003zm-28.78-.057h-12.95c-.52 0-.95.426-.95.949v56.481c0 .53.43.95.95.95h12.95c.52 0 .95-.42.95-.95V65.183a.947.947 0 0 0-.95-.949v-.004zm-6.4-25.719c-5.13 0-9.29 4.152-9.29 9.281a9.289 9.289 0 0 0 9.29 9.289c5.13 0 9.28-4.157 9.28-9.289 0-5.128-4.16-9.281-9.28-9.281z\" fill=\"#1ED760\"\/><\/svg>\n\n<\/div>\n                                    <div>    <svg class=\"logo logo-linkedin\" role=\"img\" viewBox=\"0 0 882 224\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><title>LinkedIn<\/title><g fill=\"#0A66C2\"><path d=\"M0 33.083h34.482V158.69h63.84v31.822H0V33.083zM113.566 83.77h33.127v106.682h-33.127V83.77zm16.563-53.037c10.541.002 19.214 8.676 19.214 19.217 0 10.542-8.675 19.217-19.217 19.217-10.542 0-19.217-8.675-19.217-19.217 0-10.542 8.675-19.217 19.217-19.217h.003m155.137 2.326h33.127v94.083l37.544-43.42h40.615l-43.479 49.39 42.564 57.385h-41.636l-35.166-52.734h-.435v52.727h-33.127l-.007-157.43zM165.061 83.781h31.812v14.58h.452a34.841 34.841 0 0 1 31.367-17.234c33.593 0 39.776 22.102 39.776 50.815v58.503h-33.127v-51.867c0-12.38-.227-28.296-17.253-28.296-17.219 0-19.876 13.482-19.876 27.395v52.755h-33.127l-.024-106.65z\"\/><path d=\"M466.315 124.703c.003-.156.005-.313.005-.469 0-10.896-8.966-19.862-19.862-19.862-.16 0-.32.002-.482.006-11.965-.745-22.467 8.373-23.409 20.325h43.748zm28.061 47.274a58.385 58.385 0 0 1-45.3 21.226c-33.128 0-59.65-22.113-59.65-56.354 0-34.24 26.52-56.343 59.65-56.343 30.962 0 50.38 22.084 50.38 56.343v10.387h-76.889c1.97 12.124 12.685 21.038 24.965 20.77a28.298 28.298 0 0 0 23.641-13.037l23.203 17.008zm74.128-62.42c-16.563 0-26.5 11.06-26.5 27.175 0 16.115 9.933 27.184 26.5 27.184s26.526-11.042 26.526-27.184c0-16.143-9.942-27.175-26.526-27.175m57.023 80.875H595.03v-14.148h-.452a41.684 41.684 0 0 1-32.934 16.798c-31.829 0-52.796-22.972-52.796-55.457 0-29.834 18.555-57.23 49.055-57.23 13.71 0 26.516 3.751 34.028 14.148h.435V33.048h33.157l.004 157.384zm223.637.062h-33.127v-51.878c0-12.37-.22-28.296-17.229-28.296-17.254 0-19.894 13.478-19.894 27.395v52.775h-33.126V83.808h31.801v14.58h.446a34.893 34.893 0 0 1 31.377-17.233c33.575 0 39.766 22.084 39.766 50.815l-.014 58.524zM708.41 69.225h-.004c-10.546 0-19.224-8.677-19.224-19.223s8.678-19.224 19.224-19.224c10.545 0 19.222 8.676 19.224 19.22v.004c0 10.544-8.676 19.222-19.22 19.223m16.563 121.27h-33.16V83.807h33.16v106.688zM865.678.015H675.165c-8.943-.1-16.388 7.17-16.497 16.113v191.304c.105 8.948 7.55 16.228 16.497 16.132h190.513c8.97.113 16.44-7.166 16.56-16.132V16.116c-.12-8.962-7.6-16.233-16.56-16.115\"\/><\/g><\/svg>\n\n<\/div>\n                                    <div>    \n<svg class=\"logo logo-noom\" role=\"img\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"none\" viewBox=\"0 0 132 30\"><title>Noom<\/title>\n<path fill=\"#191717\" d=\"M43.5215 0.160018C40.4528 0.61067 36.9072 2.55655 34.7417 4.97842C33.9555 5.85759 32.6595 7.79896 32.6595 8.09746C32.6595 8.20739 32.5948 8.29723 32.5156 8.29723C32.4365 8.29723 32.3718 8.38925 32.3718 8.50181C32.3718 8.6145 32.2492 8.95843 32.0993 9.26624C31.9494 9.5742 31.7478 10.1209 31.6513 10.4813C31.5547 10.8417 31.4224 11.2676 31.3572 11.4278C31.1207 12.0087 31.0378 12.9243 31.0339 14.9951C31.0302 17.0981 31.0813 17.4911 31.6134 19.4463C32.7703 23.6967 36.5718 27.6713 40.8794 29.1339C44.2834 30.2899 47.1621 30.2887 50.6336 29.1301C54.9639 27.6849 58.3006 24.2219 59.9742 19.4361C60.6273 17.5681 60.6235 12.5185 59.9673 10.5541C58.3883 5.82702 54.9669 2.31878 50.4566 0.80185C48.1992 0.0426589 45.8195 -0.177498 43.5215 0.160018ZM77.1865 0.143564C73.8702 0.648236 70.3893 2.55815 68.2578 5.04249C66.8931 6.63295 66.4993 7.28556 65.4584 9.68049C65.0213 10.6863 64.7855 11.8563 64.4935 14.4688C64.4197 15.1285 64.567 16.5508 64.91 18.4897C65.4505 21.5457 67.762 25.0536 70.5856 27.1026C77.4259 32.0669 86.6685 30.4643 91.5496 23.4675C92.551 22.0321 93.408 19.9698 93.7997 18.0529C93.8898 17.6124 94.0245 16.9726 94.0991 16.6312C94.1738 16.2896 94.2348 15.5534 94.2348 14.9951C94.2348 14.4369 94.1738 13.7007 94.0991 13.3591C94.0245 13.0176 93.8898 12.3778 93.7997 11.9374C93.1594 8.80365 91.8178 6.40376 89.4305 4.12168C87.7787 2.54257 86.1858 1.56483 84.0803 0.83767C81.8279 0.0596952 79.3655 -0.188127 77.1865 0.143564ZM3.19184 0.755839C1.9835 1.16601 1.00693 2.05698 0.434049 3.27177L0 4.19244L0.0366864 16.8378L0.0735165 29.483L2.4833 29.5228L4.89308 29.5627V17.8465C4.89308 11.4026 4.94861 6.09566 5.01652 6.05314C5.08428 6.01063 5.29389 6.28524 5.48207 6.66338C5.67039 7.04152 5.85756 7.38355 5.89828 7.42359C5.98978 7.51372 6.28845 8.04198 6.68063 8.80685C6.84478 9.12718 7.01153 9.42204 7.05109 9.46208C7.09065 9.50212 7.2574 9.79698 7.42155 10.1173C7.80769 10.8704 8.11154 11.409 8.20203 11.5006C8.29252 11.5922 8.59637 12.1308 8.98251 12.8838C9.14666 13.2042 9.31341 13.499 9.35297 13.5391C9.44346 13.6306 9.74731 14.1692 10.1335 14.9223C10.2976 15.2427 10.4643 15.5375 10.5039 15.5775C10.5435 15.6176 10.6629 15.8067 10.7692 15.9979C11.0669 16.533 11.4813 17.2724 11.7987 17.8344C12.4349 18.9611 12.6392 19.3211 13.039 20.0185C13.2685 20.419 13.5525 20.9431 13.6703 21.1834C13.788 21.4236 13.9169 21.653 13.9564 21.693C14.0274 21.7645 14.1251 21.9333 14.705 22.987C14.8641 23.2763 15.0429 23.5786 15.1023 23.6587C15.1616 23.7388 15.4062 24.1647 15.6457 24.6051C17.0348 27.1589 17.3303 27.6413 17.8122 28.1424C18.1043 28.4462 18.6998 28.8716 19.1352 29.0876C19.8196 29.427 20.103 29.48 21.222 29.477C22.3056 29.4742 22.6459 29.4126 23.3081 29.1003C24.527 28.5253 25.3965 27.4549 25.8835 25.9303C25.9933 25.5865 26.0416 21.6412 26.0416 13.0105V0.585625L25.7179 0.504668C25.5398 0.460112 24.4555 0.442494 23.3081 0.4655L21.222 0.507289L21.1501 12.3742L21.0782 24.2411L20.6774 23.5859C20.3009 22.9704 19.6694 21.8721 18.4176 19.6545C18.1237 19.134 17.4741 17.9873 16.9741 17.1064C16.474 16.2255 15.8916 15.1771 15.6798 14.7767C15.4682 14.3763 15.0995 13.7211 14.8607 13.3206C13.7593 11.4745 12.9497 10.0291 12.9497 9.90895C12.9497 9.83673 12.9006 9.75577 12.8406 9.72898C12.7805 9.70233 12.5107 9.25459 12.2411 8.73405C11.9714 8.2135 11.713 7.75485 11.6668 7.7148C11.6208 7.67476 11.4485 7.37991 11.2844 7.05957C10.8922 6.2947 10.5935 5.76644 10.502 5.67631C10.4613 5.63627 10.2671 5.2759 10.0704 4.87548C9.87363 4.47506 9.66401 4.12561 9.60474 4.09896C9.54546 4.07217 9.49684 3.95758 9.49684 3.84415C9.49684 3.73072 9.4321 3.63783 9.35297 3.63783C9.27384 3.63783 9.2091 3.56779 9.2091 3.48203C9.2091 3.25444 8.35208 2.0181 7.92336 1.62715C7.41565 1.16427 6.82033 0.860675 5.97208 0.631928C4.97551 0.363139 4.25402 0.395318 3.19184 0.755839ZM102.311 0.748267C101.226 1.12772 100.07 2.12061 99.6009 3.07535C99.0007 4.29713 98.9712 5.02298 99.0138 17.5432L99.0544 29.483H101.5H103.946L103.983 17.7158C104.013 8.16414 104.054 5.98456 104.203 6.14007C104.361 6.30402 109.399 15.1214 110.677 17.4704C111.345 18.698 111.852 19.4031 112.475 19.9728C114.274 21.6182 117.491 21.4321 119.083 19.5907C119.537 19.0655 121.121 16.394 123.055 12.8917C123.469 12.1427 123.774 11.6115 125.57 8.51564C126.127 7.55464 126.668 6.57835 126.771 6.3461L126.958 5.92399L127.055 6.2733C127.108 6.4655 127.158 11.7842 127.166 18.0928L127.18 29.5627L129.59 29.5228L132 29.483V16.8017V4.12037L131.521 3.15616C130.651 1.4035 129.207 0.50758 127.252 0.50758C126.307 0.50758 125.96 0.575724 125.31 0.890088C123.984 1.53119 123.454 2.15308 122.102 4.65707C121.864 5.09753 121.564 5.62171 121.435 5.82192C121.305 6.02213 121.107 6.38251 120.994 6.62276C120.881 6.86301 120.683 7.22338 120.554 7.42359C120.424 7.6238 120.122 8.14798 119.882 8.58844C119.642 9.0289 119.179 9.86439 118.853 10.4449C118.527 11.0256 118.002 11.9755 117.687 12.5562C117.371 13.1369 117.05 13.7101 116.974 13.8303C116.897 13.9504 116.571 14.5236 116.249 15.1043C115.927 15.6849 115.617 16.1598 115.559 16.1595C115.502 16.1592 115.253 15.7826 115.006 15.3223C114.759 14.862 114.29 14.0105 113.963 13.4299C113.145 11.9755 112.283 10.4471 111.623 9.28007C110.397 7.11214 109.862 6.1507 109.469 5.41C109.242 4.98323 108.94 4.45904 108.797 4.24515C108.654 4.03125 108.383 3.54376 108.195 3.16169C107.766 2.28718 106.673 1.24304 105.781 0.855725C104.737 0.401725 103.419 0.360954 102.311 0.748267ZM48.5019 5.39981C50.6543 6.10964 52.0308 7.09132 53.5563 9.00415C53.6947 9.17771 53.808 9.35812 53.808 9.40486C53.808 9.4516 53.9264 9.66389 54.0712 9.87648C54.5662 10.6035 55.0797 12.2084 55.3943 14.0123C55.5671 15.0037 55.4782 15.9771 55.0718 17.5432C54.5248 19.6504 53.9743 20.6519 52.5863 22.0656C51.3159 23.3596 50.344 23.9767 48.6639 24.5559C47.7124 24.8841 47.2979 24.9413 45.8234 24.9485C44.7911 24.9534 43.8656 24.8816 43.5215 24.7701C41.3546 24.067 39.7561 23.087 38.5769 21.7384C37.9413 21.0114 37.1083 19.5321 36.5757 18.1845C36.2307 17.311 36.0707 15.0439 36.2516 13.5894C36.4313 12.145 36.4812 11.9681 37.0771 10.666C38.41 7.75339 41.1674 5.60613 44.2408 5.08719C45.342 4.90125 47.4616 5.05676 48.5019 5.39981ZM82.2009 5.45572C83.7079 5.93986 84.8146 6.61547 85.8931 7.70971C87.3848 9.22328 87.6536 9.66506 88.6431 12.2286C88.9439 13.0082 88.9137 17.0464 88.6007 17.9072C87.912 19.8003 86.8639 21.519 85.8207 22.4659C84.9467 23.2592 83.3003 24.2044 82.1646 24.565C81.1142 24.8982 80.6769 24.9569 79.2726 24.9526C77.8771 24.9482 77.438 24.887 76.4672 24.5616C72.9195 23.3724 70.9078 21.0541 69.8337 16.9173C69.6065 16.0423 69.5676 14.0016 69.7652 13.331C70.3997 11.1776 70.7481 10.2912 71.2976 9.4315C72.7715 7.12539 75.2493 5.49562 77.9058 5.08472C79.046 4.90839 81.0305 5.07977 82.2009 5.45572Z\" clip-rule=\"evenodd\" fill-rule=\"evenodd\"><\/path>\n<\/svg>\n\n<\/div>\n                                    <div>    <svg class=\"logo logo-shopify\" role=\"img\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 214 61\"><title>Shopify<\/title><path fill=\"#95BF47\" d=\"M52.95 56.02 36.94 60 0 53.61s4.408-34.083 4.571-35.283c.22-1.59.273-1.64 1.958-2.17l5.723-1.772c.356-2.552 1.612-5.848 3.264-8.472 2.347-3.728 5.242-5.827 8.148-5.91 1.506-.045 2.764.465 3.744 1.515a5 5 0 0 1 .203.234c.157-.013.311-.028.467-.028h.009c2.25.004 4.114 1.287 5.384 3.714.35.675.638 1.382.86 2.11 1.124-.348 1.791-.554 1.794-.556.268-.08.957-.186 1.31.167.353.352 3.925 3.822 3.925 3.822s4.272.065 4.49.083a.58.58 0 0 1 .526.489c.041.303 6.574 44.467 6.574 44.467zM28.732 3.72c.686 1.769.86 3.817.882 5.288l2.866-.887c-.458-1.488-1.543-3.983-3.748-4.401zm-1.051 5.888c.02-1.607-.155-3.982-.958-5.66-.856.353-1.579.97-2.095 1.525-1.388 1.489-2.518 3.762-3.114 6.044l6.167-1.91zm-13.36 4.134 5.066-1.568c.564-2.966 1.979-6.041 3.825-8.021.712-.764 1.471-1.35 2.257-1.758-.491-.323-1.065-.473-1.748-.458-4.486.13-8.4 7.136-9.4 11.805zm9.01 4.958c-8.132.512-11.817 6.199-11.462 11.81.421 6.668 7.086 6.429 7.342 10.487.062.98-.547 2.367-2.253 2.475-2.61.165-5.87-2.295-5.87-2.295L9.841 46.48s3.239 3.47 9.124 3.1c4.902-.31 8.304-4.232 7.943-9.965-.46-7.288-8.644-7.967-8.84-11.078-.037-.571.001-2.844 3.607-3.072 2.458-.155 4.532.788 4.532.788l1.86-6.956s-1.603-.8-4.736-.597z\"\/><path fill=\"#5E8E3E\" d=\"M45.851 11.066c-.218-.02-4.489-.084-4.489-.084s-3.572-3.47-3.925-3.821a.87.87 0 0 0-.496-.228l.002 53.065L52.95 56.02s-6.532-44.162-6.574-44.465a.581.581 0 0 0-.526-.49h.001z\"\/><path d=\"M74.032 33.864c-1.84-1-2.787-1.841-2.787-3 0-1.471 1.314-2.417 3.367-2.417 2.389 0 4.522.998 4.522.998l1.682-5.154s-1.547-1.21-6.1-1.21c-6.337 0-10.729 3.629-10.729 8.73 0 2.893 2.05 5.102 4.787 6.679 2.209 1.26 2.998 2.156 2.998 3.47 0 1.367-1.105 2.472-3.155 2.472-3.056 0-5.942-1.58-5.942-1.58l-1.788 5.156s2.666 1.788 7.152 1.788c6.522 0 11.202-3.208 11.202-8.993-.001-3.1-2.367-5.31-5.209-6.94zm25.981-10.834c-3.208 0-5.733 1.525-7.678 3.838l-.105-.053 2.787-14.567h-7.258l-7.047 37.076h7.258l2.42-12.674c.946-4.787 3.418-7.73 5.732-7.73 1.63 0 2.262 1.104 2.262 2.682 0 1-.105 2.21-.315 3.208l-2.734 14.515h7.258l2.839-14.99c.316-1.577.527-3.47.527-4.732-.003-4.103-2.159-6.574-5.945-6.574h-.001zm22.35 0c-8.731 0-14.514 7.888-14.514 16.67 0 5.627 3.47 10.149 9.992 10.149 8.572 0 14.357-7.677 14.357-16.67 0-5.206-3.051-10.15-9.835-10.15zm-3.576 21.247c-2.472 0-3.524-2.104-3.524-4.734 0-4.154 2.157-10.938 6.101-10.938 2.577 0 3.417 2.21 3.417 4.366 0 4.469-2.154 11.306-5.994 11.306zm31.975-21.247c-4.899 0-7.679 4.312-7.679 4.312h-.104l.421-3.891h-6.416c-.315 2.63-.895 6.625-1.472 9.623l-5.049 26.557h7.258l1.997-10.728h.159s1.489.946 4.26.946c8.519 0 14.093-8.73 14.093-17.565 0-4.89-2.157-9.254-7.468-9.254zm-6.942 21.35c-1.884 0-2.999-1.051-2.999-1.051l1.21-6.784c.842-4.522 3.208-7.52 5.733-7.52 2.209 0 2.892 2.05 2.892 3.997 0 4.68-2.787 11.359-6.836 11.359v-.001zm24.77-31.763c-2.313 0-4.154 1.84-4.154 4.206 0 2.157 1.367 3.63 3.418 3.63h.105c2.262 0 4.207-1.526 4.26-4.207 0-2.104-1.42-3.63-3.629-3.63zm-10.149 36.707h7.256l4.945-25.715h-7.311l-4.89 25.715zm30.66-25.768h-5.049l.262-1.21c.421-2.471 1.894-4.68 4.313-4.68a7.505 7.505 0 0 1 2.313.368l1.42-5.68s-1.262-.63-3.945-.63c-2.577 0-5.152.736-7.099 2.418-2.472 2.104-3.629 5.153-4.207 8.204l-.209 1.21h-3.367l-1.052 5.47h3.367l-3.839 20.3h7.258l3.839-20.3h4.996l.999-5.47zm17.459.054s-4.537 11.43-6.574 17.669h-.106c-.138-2.01-1.788-17.67-1.788-17.67h-7.626l4.367 23.61c.106.527.053.844-.158 1.21-.843 1.63-2.262 3.21-3.945 4.367-1.367.999-2.892 1.63-4.101 2.05L188.627 61c1.473-.315 4.522-1.526 7.099-3.944 3.314-3.103 6.363-7.89 9.518-14.41l8.888-19.038h-7.572v.002z\"\/><\/svg>\n\n<\/div>\n                                    <div>    <svg class=\"logo logo-lyft\" role=\"img\" viewbox=\"0 0 199 141\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><title>Lyft<\/title><path d=\"M.746 3.343h30.06v80.674c0 12.767 5.84 20.372 10.458 23.632-4.889 4.346-19.829 8.149-30.966-1.087C3.732 101.118.746 92.166.746 83.745V3.343zm187.863 67.014v-8.478h9.168V32.136h-10.068C183.844 14.279 167.946.898 148.933.898c-21.903 0-39.658 17.756-39.658 39.658v69.459c6.24.877 13.674-.109 19.999-5.354 6.565-5.445 9.551-14.396 9.551-22.817v-2.559h15.013V49.542h-15.013v-8.986h.036c0-5.562 4.509-10.071 10.072-10.071 5.562 0 10.089 4.509 10.089 10.071v29.801c0 21.902 17.774 39.658 39.676 39.658V80.428c-5.562 0-10.089-4.509-10.089-10.071zM74.761 32.136v43.651c0 2.478-2.056 4.487-4.593 4.487s-4.593-2.009-4.593-4.487V32.136H35.831v51.338c0 9.235 3.132 20.915 17.385 24.718 14.268 3.807 22.545-4.074 22.545-4.074-.754 5.192-5.644 8.995-13.521 9.81-5.96.616-13.582-1.358-17.384-2.988v27.199c9.688 2.857 19.935 3.78 29.963 1.834 18.199-3.531 29.685-18.742 29.685-38.979V32.136H74.761z\" fill=\"#EA0B8C\" fill-rule=\"evenodd\"\/><\/svg>\n\n<\/div>\n                                    <div>    <svg class=\"logo logo-chartboost\" role=\"img\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"none\" viewBox=\"0 0 206 31\"><title>Chart boost<\/title><g fill=\"currentColor\" clip-path=\"url(#chartboost-a)\"><path d=\"M44.577 18.523c0-7.131 4.357-11.975 11.108-11.975 5.153 0 8.912 3.027 9.777 7.905h-3.06c-.898-3.263-3.36-5.215-6.851-5.215-4.89 0-8.016 3.836-8.016 9.285 0 5.448 2.993 9.284 7.882 9.284 3.593 0 6.087-1.918 6.95-5.215h3.061c-.865 4.878-4.724 7.905-9.977 7.905-6.683.003-10.874-4.775-10.874-11.974m38.345 2.22v9.553h-2.728v-9.383c0-3.566-1.697-5.449-4.624-5.449-3.16 0-5.123 2.08-5.123 6.258v8.58H67.72V6.547h2.727v9.918c.795-2.171 2.728-3.528 5.587-3.528 3.793 0 6.885 2.12 6.885 7.805zm18.795 7.033v2.522h-1.498c-2.26 0-1.973-1.56-2.007-3.242-.837 2.14-3.812 3.444-6.74 3.444-3.724 0-6.252-1.884-6.252-5.011 0-3.43 2.36-5.348 6.82-5.348h4.988v-1.178c0-2.22-1.564-3.565-4.223-3.565-2.395 0-3.992 1.143-4.325 2.894h-2.728c.399-3.364 3.092-5.348 7.184-5.348 4.322 0 6.82 2.186 6.82 6.189v7.502c0 .907.332 1.143 1.096 1.143h.865zm-4.69-5.317h-5.256c-2.428 0-3.792.907-3.792 2.86 0 1.682 1.43 2.825 3.693 2.825 3.391 0 5.356-1.984 5.356-4.844zm15.607-9.319v2.69h-1.364c-3.559 0-4.889 2.995-4.889 5.72v8.745h-2.36V13.14h2.36v3.384c.84-2.532 2.46-3.384 5.487-3.384zm1.996 2.526V6.548h2.728v6.592h4.39v2.523h-4.39v10.125c0 1.446.498 1.985 1.961 1.985h2.694v2.523h-2.961c-3.26 0-4.425-1.446-4.425-4.476V15.666zm26.535 6.054c0 5.246-3.46 8.78-8.149 8.78-2.862 0-4.545-.919-6.188-3.312v3.11h-2.36V6.548h2.36v9.35c1.287-2.197 3.326-2.96 6.188-2.96 4.689 0 8.149 3.197 8.149 8.781m-2.794 0c0-3.736-2.26-6.325-5.62-6.325-3.36 0-5.587 2.589-5.587 6.258s2.261 6.39 5.587 6.39c3.325 0 5.62-2.588 5.62-6.324m4.676.002c0-5.216 3.459-8.782 8.413-8.782 4.955 0 8.414 3.566 8.414 8.781 0 5.216-3.459 8.781-8.414 8.781-4.954 0-8.413-3.565-8.413-8.78m14.035 0c0-3.667-2.261-6.325-5.622-6.325-3.359 0-5.62 2.658-5.62 6.324s2.261 6.324 5.62 6.324c3.361 0 5.622-2.658 5.622-6.324m4.73.001c0-5.216 3.458-8.782 8.413-8.782s8.414 3.566 8.414 8.781c0 5.216-3.459 8.781-8.414 8.781s-8.413-3.565-8.413-8.78m14.033 0c0-3.667-2.261-6.325-5.62-6.325-3.36 0-5.621 2.658-5.621 6.324s2.261 6.324 5.621 6.324c3.359 0 5.62-2.658 5.62-6.324m8.059 2.926c.099 2.019 1.861 3.5 4.688 3.5 2.395 0 4.092-1.043 4.092-2.624 0-2.155-1.862-2.322-4.391-2.624-3.792-.47-6.818-1.244-6.818-4.81 0-3.127 2.827-5.18 6.65-5.146 3.858.035 6.653 1.85 6.92 5.417h-2.793c-.2-1.748-1.797-3.061-4.124-3.061-2.326 0-3.957 1.008-3.957 2.589 0 1.883 1.796 2.12 4.256 2.422 3.859.472 6.951 1.212 6.951 5.011 0 3.197-3.026 5.181-6.786 5.181-4.39 0-7.417-2.085-7.483-5.852h2.795zm13.871-11.505V6.548h2.728v6.592h4.391v2.523h-4.391v10.125c0 1.446.499 1.985 1.962 1.985h2.693v2.523h-2.96c-3.261 0-4.426-1.446-4.426-4.476V13.14zM25.768 6.312C18.487 17.666 9.235 26.045.157 28.844c0 0 13.61-9.035 18.515-24.655L24.299.5z\"\/><path d=\"M24.732 13.33C17.359 21.83 9.102 27.94.96 30.45h31.955c1.554-4.257 2.403-8.513 2.544-12.772.195-5.838-6.928-8.735-10.73-4.35z\"\/><\/g><defs><clipPath id=\"chartboost-a\"><path fill=\"currentColor\" d=\"M.158.5h205v30h-205z\"\/><\/clipPath><\/defs><\/svg>\n\n<\/div>\n                            <\/div>\n            <\/div>\n<\/section>\n\n\n\n<div class=\"wp-block-columns\">\n<div class=\"wp-block-column\"><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" src=\"https:\/\/d2h1bfu6zrdxog.cloudfront.net\/wp-content\/uploads\/2023\/03\/g2-leader-winter-2023.png\" alt=\"\" class=\"wp-image-32119\"\/><\/figure>\n<\/div><\/div>\n\n\n\n<div class=\"wp-block-column\"><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" src=\"https:\/\/d2h1bfu6zrdxog.cloudfront.net\/wp-content\/uploads\/2023\/03\/g2-users-love-us.png\" alt=\"\" class=\"wp-image-32120\"\/><\/figure>\n<\/div><\/div>\n<\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"best-interview-practices-for-full-stack-roles\">Best interview practices for full stack roles<\/h2>\n\n\n\n<p>The full stack interview process can significantly differ based on aspects such as the specific engineering position and the candidate&#8217;s degree of expertise. To enhance the effectiveness of your full stack interview questions, it&#8217;s suggested to follow these best practices while engaging with your interviewees:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Devise technical queries that relate to actual scenarios within your company &#8211; this approach is not only more engaging for the interviewee but also better demonstrates the compatibility of their skills with your team.<\/li>\n\n\n\n<li>Foster an environment of collaboration by motivating the candidate to pose questions throughout the task.<\/li>\n\n\n\n<li>As full stack applicants are expected to work with front-end elements, they should have a solid grasp of basic UI\/UX design principles.<\/li>\n<\/ul>\n\n\n\n<p>Furthermore, it&#8217;s crucial to adhere to conventional interview protocols during full stack interviews &#8211; adjust the complexity of interview questions relative to the candidate&#8217;s development skill level, provide timely feedback regarding their status in the recruitment process, and allocate sufficient time for candidates to inquire about the evaluation or the experience of working with you and your team.<\/p>\n","protected":false},"parent":0,"menu_order":0,"template":"","class_list":["post-34780","interview-questions","type-interview-questions","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/coderpad.io\/wp-json\/wp\/v2\/interview-questions\/34780","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/coderpad.io\/wp-json\/wp\/v2\/interview-questions"}],"about":[{"href":"https:\/\/coderpad.io\/wp-json\/wp\/v2\/types\/interview-questions"}],"wp:attachment":[{"href":"https:\/\/coderpad.io\/wp-json\/wp\/v2\/media?parent=34780"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}