- Видео 15
- Просмотров 88 114
Justin Lawrence
США
Добавлен 30 май 2014
On this channel we talk with aspiring front-end engineers and help them grow through mock interviews.
Видео
WebAssembly + Rust
Просмотров 157Год назад
Alex gives a talk about Wasm, Rust, and adding an existing codebase to the browser as a part of our bi-weekly Front End Guild meetup. Join our Discord server and chat with Alex! discord.gg/d6rga8weFy
Junior React Interview - Part 1: Verbal
Просмотров 749Год назад
This is the first half of a mock junior React interview with Cody Marshall. We do a debrief at the end of the second interview (ruclips.net/video/GY40Gm4tpa4/видео.html). Join our Front End Guild Discord server: discord.gg/HXpRtNxnvx Join Justin's Weekly Developer newsletter: weeklydeveloper.substack.com/ Cody's LinkedIn: www.linkedin.com/in/cody-marshall94/ Justin's LinkedIn: www.linkedin.com/...
Junior React Interview - Part 2: Coding + Debrief
Просмотров 1,1 тыс.Год назад
This is the second half of a mock junior React interview with Cody Marshall. At the end, we debrief both portions of the interview. Join our Front End Guild Discord server: discord.gg/HXpRtNxnvx Join Justin's Weekly Developer newsletter: weeklydeveloper.substack.com/ Cody's LinkedIn: www.linkedin.com/in/cody-marshall94/ Justin's LinkedIn: www.linkedin.com/in/justinmarklawrence/
Junior JavaScript Interview - Part 2: Algorithm + Debrief
Просмотров 922Год назад
This is the second half of a mock junior JS interview with Aondrej Grant-Ryan. At the end, we debrief both portions of the interview. Join our Front End Guild Discord server: discord.gg/HXpRtNxnvx Join Justin's Weekly Developer newsletter: weeklydeveloper.substack.com/ Drej's LinkedIn: www.linkedin.com/in/aondrej-grant-ryan/ Justin's LinkedIn: www.linkedin.com/in/justinmarklawrence/
Junior JavaScript Interview - Part 1: Verbal
Просмотров 557Год назад
I do a mock junior JS interview with Aondrej Grant-Ryan Join our Front End Guild Discord server: discord.gg/HXpRtNxnvx Join Justin's Weekly Developer newsletter: weeklydeveloper.substack.com/ Drej's LinkedIn: www.linkedin.com/in/aondrej-grant-ryan/ Justin's LinkedIn: www.linkedin.com/in/justinmarklawrence/
Junior JavaScript Interview - Part 2: Algorithm + Debrief
Просмотров 711Год назад
This is the second half of a mock junior JS interview with Jay Setlock. At the end, we do a debrief on both portions of the interview. Join our Front End Guild Discord server: discord.gg/HXpRtNxnvx Join Justin's Weekly Developer newsletter: weeklydeveloper.substack.com/ Jay's LinkedIn: www.linkedin.com/in/jaysetlock/ Justin's LinkedIn: www.linkedin.com/in/justinmarklawrence/
Junior JavaScript Interview - Part 1: Verbal
Просмотров 1,2 тыс.Год назад
I do a mock junior JS interview with Jay Setlock. Join our Front End Guild Discord server: discord.gg/HXpRtNxnvx Join Justin's Weekly Developer newsletter: weeklydeveloper.substack.com/ Jay's LinkedIn: www.linkedin.com/in/jaysetlock/ Justin's LinkedIn: www.linkedin.com/in/justinmarklawrence/
Mid-Level JavaScript Interview - Part 2: Algorithm + Debrief
Просмотров 1,4 тыс.Год назад
I do a mock mid-level JS interview with an awesome developer Michael Alvarez. Join our Front End Guild Discord server: discord.gg/HXpRtNxnvx Join Justin's Weekly Developer newsletter: weeklydeveloper.substack.com/ Michael's LinkedIn: www.linkedin.com/in/awwmicky/ Justin's LinkedIn: www.linkedin.com/in/justinmarklawrence/
Mid-Level JavaScript Interview - Part 1: Verbal
Просмотров 1,3 тыс.Год назад
I do a mock mid-level JS interview with an awesome developer Michael Alvarez. Join our Front End Guild Discord server: discord.gg/HXpRtNxnvx Join Justin's Weekly Developer newsletter: weeklydeveloper.substack.com/ Michael's LinkedIn: www.linkedin.com/in/awwmicky/ Justin's LinkedIn: www.linkedin.com/in/justinmarklawrence/
Mid-Level JavaScript Interview
Просмотров 7 тыс.Год назад
I do a mock mid-level JS interview with an awesome developer Nikko Elliott. Join our Front End Guild Discord server: discord.gg/HXpRtNxnvx
Mid-level React Interview
Просмотров 73 тыс.2 года назад
I do a mock interview with a developer at work, Cody. He crushes it! Join our Front End Guild Discord server: discord.gg/HXpRtNxnvx We built a platform to guarantee your resume gets seen by a human: hackerrelay.com
Game Challenge 3 | RTS in TypeScript and React
Просмотров 1903 года назад
Game Challenge 3 | RTS in TypeScript and React
Making a 2D Platforming Engine/Game
Просмотров 1058 лет назад
The early stages of 2d platformer engine/game that 3 friends and I started work on and logged about 12 hours against.
JavaScript Platformer 12 Hour Time-Lapse
Просмотров 1489 лет назад
A time lapse of my cousin and I programming and designing a platformer in 12 hours. One of many hackathons to come. Mostly a learning experience.
Nice video, but I have a feedback: publish the interview videos without musics. It's more realistic and for non-natives, like me, it's a little more hard to undestanding the words (yes, have subtitles, but in real interview we don't). However, really good format.
Fine Cody the pressure is extremely high these moments. Interviewer nice approach.
That was a fun coding challenge. I liked it and decided to do it myself in 5 minutes or less, without Google or other helping tools. I got something like this: const getLongestWord = (string) => { const wordArray = []; let word = string[0]; for(i = 1; i < string.length; i++) { if(string[i] == string[i-1]) { wordArray.push(word); word = string[i]; } else { word += string[i]; } if(i == string.length - 1) wordArray.push(word); } let longestWord = wordArray[0]; for(word of wordArray) { if(word.length > longestWord.length) longestWord = word; } console.log(longestWord); } getLongestWord('ABCDDDEFGHI');
let LongestSubString = str.replace(/(\w)\1+/gi,' ').split(' ').sort((a,b)=>b.length - a.length)[0]; let misingLetter = String.fromCharCode(LongestSubString[0].charCodeAt(0) - 1); console.log(misingLetter+LongestSubString)
1. State and Context
the background music ruins everything smh.
I have an interview in a few days, and this is gold. The last part about asking clarifying questions is so good.
Technical Questions and Answers React Fundamentals: State vs. Context: Explained the difference between state and context in React. State Updates: Discussed how to trigger state changes in parent components from child components. Redux: Shared thoughts on Redux and its boilerplate nature. Component Passing: Explained how to pass components as props to other components. Coding Exercise: Longest Substring.
another way function getIterateData(str, list) { let filterChar = list ?? "ABCDDDEFGHI"; let filterStr = Array.from(filterChar.split(" ")[0]); let pos = filterChar.indexOf(str) + str.length; let strVal = []; let center = Math.floor((filterChar.length - 1) / 2); let uniqueValue; if (pos <= center) { for (let i = 1; i <= filterChar.length; i++) { if (i > str.length) { if ( strVal.includes(filterStr[i]) === false && filterStr[i] != undefined ) { strVal.push(filterStr[i]); } } } uniqueValue = strVal.join(""); } else { uniqueValue = filterChar.slice(0, filterChar.length - str.length); } return uniqueValue; } console.log(getIterateData("FGHI", "ABCDDDDEFGHI"));
this my solution function getNoNRepeatedLongChar(str, list) { let filterChar = list ?? "ABCDDDEFGHI"; let pos = filterChar.indexOf(str) + str.length; let center = Math.floor((filterChar.length - 1) / 2); let uniqueValue; if (pos <= center) { uniqueValue = filterChar.slice(pos).split(" ")[0]; } else { uniqueValue = filterChar .slice(0, filterChar.length - str.length) .split(" ")[0]; } return [...new Set(uniqueValue)].join(""); } console.log(getNoNRepeatedLongChar("ABCD", "ABCDDDDEFGHI"));
I'm not sure, is there is any for JS, but I'd use there two set data structure - the first one is currentLongestUniqSequence and the other is literralylongestUniqSequence. Then iterating through input string, check if currentLongestUniqSequence contains current one charater. If its not, add it, otherwise compare the legth of both sets and if current greater, replace the longest with a current. I did it on C# and works good. Code: public static string GetLongestUniqCharacterSequence(string source) { var currentUniqSequence = new HashSet<char>(); var longestUniqSequence = new HashSet<char>(); for(var i = 0; i < source.Length; ++i) { if (currentUniqSequence.Contains(source[i])) { if (currentUniqSequence.Count > longestUniqSequence.Count) { longestUniqSequence = currentUniqSequence; } currentUniqSequence = new(); continue; } currentUniqSequence.Add(source[i]); } if (currentUniqSequence.Count > longestUniqSequence.Count) { longestUniqSequence = currentUniqSequence; } var sb = new StringBuilder(); foreach (var ch in longestUniqSequence) { sb.Append(ch); } return sb.ToString(); }
The music is a little bit distracting and making hard to understand sometimes. :( Othewise awesome job!
Have you a version without background music?
me personally would not even call him a junior at this point, but pretty good interview, questions at the start were more like an internship level max
const getLongestNonRepeatingSubstring = (s) => { let result = "" for (let i = 0; i < s.length; i++) { let char = s[i]; let newString = s.substring(0, i) if (!newString.includes(char)) { result += char } } return result }
bullshit interview
great content but the music is not helpful
This guy managed to switch career at this point of his life, what a great guy! Imagine how good he'd be if he discovered coding when he was young!
interesting interview! I have a short solution to the algorithm question ```js const longestNonRepeatingSequence = (str) => str .match(/.*?(.)(?=\1|$)/g) .reduce((acc, item) => (item.length > acc.length ? item : acc), ""); ```
damn . that was awesome
really loved watching this, i kept pausing after the question to quickly think about what i would say and how I would write the function before Cody answered. My solution was super similar apart from i used **continue ** in my if block in the loop and at the end to find the longest str in the array i did: return strArr.reduce((longest, current) => { return current.length > longest.length ? current : longest; }, ' ');
Nice video but I think the candidate overall would have failed in my book. 1. They answered all the React questions in the beginning pretty well. 2. The solution for the coding challenge is pretty much O(n^2) due to the includes nested in the for loop. The solution is not optimal and a pretty messy. 3. The react code was messy. The util method should have been brought in from another file instead of residing in the component. The util function itself should have been "pure" and should not include any React state setter methods. That should be done outside of the util method. Not knocking the interviewee at all though, it's a lot harder under pressure obviously.
I think a good way to practice would be to copy a hackerrank problems into a react app, display the result(s) in a component, then make an input for the user to see different results from whatever the hackerrank question is asking to do. That seems to be the theme for many of the early-mid level questions. Cody kept saying something along the lines of "Theres probably a better way to do this" and I think that's ok to say, but if you say it too frequently, it makes you seem less confident or qualified. You might want to reword it in a more 'impressive' way by saying something like "I would probably review the documentation to make sure this is the best way to do this...".
Around 1:01:30 Justin seems to justify the usage of a "tricky" problem such as LeetCode 6. ZigZag Conversation for the sake of "seeing how an interviewee approaches a problem" or just to "weed out candidates." I think that this an extremely poor way of interviewing a people. What exactly are we testing for here with a problem that doesn't utilize a recognized algorithm like sorting or searching and isn't directly applicable to many use cases in production? Are we testing for pattern matching or the ability to simulate the physical layout or structure? Unless the applicant was applying for a job where they would be doing game development, implementing some sort of rendering algorithm or doing complex data processing and formatting asking a candidate this type of question is at best an exercise in pointless problem solving. At worst it's emotional and intellectual hazing or waterboarding that doesn't bring out the best in candidates. It says a lot of a company and the engineering culture if the interviewer busts this question out during a front end interview: cut your losses and apply somewhere else.
Plz decrease music volume, it's good for us to focus on discussion.😊
what is the name of this extention, when he typing, we saw somthing in front of that line. plz let me know.
This is a great video which deserves more views. Well done Cody, you know your stuff!
He sure does!
I was wondering about your question smth llike what we get if we pass the component to another component. so, can be the answer that we will get a HOC(high order component) which get and return a component. if we use TS, so we can describe it like React.NodeChild. i'm a junior, so don't judge me please. but can it be the answer?
having a b2 level of english, will be deat on the tree first minute 🤮
My preety solution with reducer. .... Changing the condition to "actualChar === result[0][0]" gives you the second version. const longestUniqueSequention = (str) => { return [...str] .reduce((result, actualChar) => { actualChar <= result[0][0] // OR === ? result.unshift([actualChar]) : result[0].unshift(actualChar); return result; }, [[]]) .sort((a, b) => a.length < b.length) .at(0) .reverse() .join(''); } console.log(longestUniqueSequention('ABCDDDDEFGHI')); // <= DEFGHI === DEFGHI console.log(longestUniqueSequention('ABCDEFGHDDDEFGHI')); // <= ABCDEFGH === ABCDEFGHD console.log(longestUniqueSequention('ABABAABABCABAB')); // <= ABC === ABABCABAB console.log(longestUniqueSequention('ABABABABABAB')); // <= AB === ABABABABABAB
Awesome!! 👏🏻
The solution to this is wrong tho. If we had another string for example str = 'ABCDAEFGH' - the longest string here is 'BCDAEFGH'. The solution cody provided wouldn't work , so you need to check with either the substring method or charAt because you need to see if one of the characters is repeated.
Great catch!
- He did not crush it, he would have been rejected. - This is not a mid level interview, more like an entry level one.
Great feedback!
i had the same feeling, he didn't answer the basic technical questions at the start. Feels more like junior level
Grate sir and very affordable
Another great vid, Justin!. What seems like such a simple algo is nothing but. Your solution is so eloquent. Mine not so much, but would love your feedback on it when you have some time. const replaceLongestZeros = (s) => { const hm = {} for (let i = 0; i < s.length; i++) { if (s[i] === '0') { if (!hm[i]) { hm[i] = { stidx: i, enidx: i } } if (hm[i-1]) { hm[i] = { ...hm[i-1], enidx: hm[i-1].enidx + 1 } } } } let stidx = 0, enidx = 0 for (const i in hm) { if (hm[i].enidx - hm[i].stidx >= enidx - stidx) { stidx = hm[i].stidx enidx = hm[i].enidx } } return [...s].map((x, idx) => idx >= stidx && idx <= enidx ? '#' : x).join('') }
Love your videos! Your solutions to these nasty algos are sublime. Just a mention but you could have just used flat().join('') instead of reduce. Keep em coming!
Don't think hashmaps are necessary. Have you tried flatMap using new Set and then just loop checking if indexOf === lastIndexOf and push to array.
const charCountMap = {}; str.split().forEach((char) => { charCountMap[char] = charCountMap[char] + 1; }) let mostUsedCharKey; Object.keys(charCountMap).forEach((key) => { if (!mostUsedCharKey) { mostUsedCharKey = key; return; } if (charCountMap[mostUsedCharKey] > charCountMap[key]) return; mostUsedCharKey = key; }) return charCountMap[mostUsedCharKey] I'm sure that there is a better way to do this but I have not looked anywhere so this is my best. Complexity kind of O(n*2) I guess.
I would just add (based on my interview experience) that perhaps stating that you have never touched something or don't know it (in the redux/jotai question) does not really add anything to conversation other then name drop. If you don't have any knowledge to share, a simple don't know about it would suffice.
Not sure I understand how the algorithm challenge has anything to do with react. Seems 90% of time not about react. And the code challenge was not well explained. Thought any consecutive same chars should have been eliminated in the results, but guess I was wrong.
const getLongestNonRepeatingStr = (str) => { //pointer let tempStr = ""; //current longest str; let longestStr = ""; for (let i = 0; i < str.length; i++) { tempStr += str[i]; if (str[i] === str[i + 1]) { if (longestStr.length < tempStr.length) { longestStr = tempStr; } tempStr = ""; } } if (longestStr.length < tempStr.length) { longestStr = tempStr; } return longestStr; }; console.log(getLongestNonRepeatingStr("ABCDDEFGHI"));
The use of Array.includes method will affect the time complexity that will be O(n^2), nested loop so to speak.
chale i no reach!
guys take it easy, as he said it is a MOCK interview haha
This should work in python def uniqueWords(wordsList): hashMap = {} counter = 0 for words in wordsList: for idx in range(len(words)): currentWord = words[idx] if currentWord not in hashMap: hashMap[currentWord] = counter else: if hashMap[currentWord] != counter: del hashMap[currentWord] counter += 1 return list(hashMap.keys()) print(uniqueWords([["hello", "goodbye", "morning", "hello"], ["goodbye", "night"]])) Should return ['hello', 'morning', 'night']
So I think this same problem is on leetcode and it's called Longest Substring Without Repeating Characters. The leetcode problem wants you to return the number of repeating characeters instead of retuning the the actual letters. For this problem you wanna use a sliding window approach. The way it works is that you would want to have a window of charaters and the moment you run into a character you have seen before, you want to shrink your window until it fits your constraint of no repeating characters. I will share the python code below which should be fairly easy to understand. This will return the length instead of the actual characters. def lengthOfLongestSubstring(self, s: str) -> int: left = 0 right = 0 maxSub = 0 visited = set() end = len(s) - 1 while right < len(s): current = s[right] while current in visited: visited.remove(s[left]) left += 1 visited.add(current) right += 1 maxSub = max(maxSub, right - left) return maxSub
const replaceLongest = (str: string) => { const longest = str .split('1') .reduce((item: string, acc: string) => acc.length > item.length ? acc : item ); const replacer = longest.replaceAll('0', '#'); return str.replaceAll(longest, replacer); };
I like it.
Now seriously though, is this interview even junior level. I mean I figured in the first 10s that you should create an array to add chunks then sort it by length. And despite this, when I apply for a position, I dont even get an interview call, not even for an unpaid internship position. It makes me feel bad since I self-studied React 2 Yrs. My portoflio is still in building phase, but the ideas I try to execute require extensive development (Job Platform, Company Portal, ECommerce Everything) Should I copy porfolio projects and then rewrite them as my own (while still working on my own projects) , just to get to the interview ?
Let’s chat! discord.gg/4hmnhYpfDg
Thanks for recording and posting this presentation.
No problem!
const getLongest = (str) => { var currStr = ""; var tempStr = ""; for(let i = 0; i < str.length; i++){ if( str[i + 1] && (str[i] != str[i + 1])){ tempStr += str[i]; }else{ if(tempStr.length + 1 > currStr.length){ currStr = tempStr + str[i]; tempStr = ""; } } } return currStr; }
As a person who preparing for frontend interviews, it really helped. Many people talk about the question because the question may seem like focused on algorithm. I don't know if this is the best interview for the md-level "react" interview though, the point is that. This video is really helpful for me. I really appreciate it you made this video and uploaded it on youtube. Thank you very much! I'm looking forward to further mock interview videos!
Glad it was helpful!!
here us ny pathetic try to solve that: let str = '0010001010000101'; let startOfTheLongestZeros = 0; let count = 0; let isZerosRow = false; let max = {start:0, count:0}; const strArray = [...str] strArray.forEach((char,index) => { if(char === '1') { if(count > max.count) { max.start = startOfTheLongestZeros; max.count = count; console.log(max) } isZerosRow = false; count = 0; } if(char === '0') { if(!isZerosRow) { startOfTheLongestZeros = index; } isZerosRow = true; count++; } }) strArray.splice(max.start, max.count,Array(max.count).fill('#').join('')) console.log(strArray.join(''));
Awesome!