Charles Max_Wood:
Hey everybody and welcome back to another episode of Adventures in Angular. Y'all I record so many of these, I almost lost track of which one I was on. This week on our panel we have Subra Mishra.
Subrat_Mishra:
Hello, hello.
Charles Max_Wood:
I'm Charles Maxwood from Top End Devs, and this week we're talking to Maria Korneva. Is that how you say that? All right, Maria, do you wanna tell us who you are and why you're awesome and all that stuff?
Maria_Korneeva:
Why not? Yes, I am a front end technology lead at a small German company. I'm developing some web applications by day and I'm writing some blogs by night. Here and now I also have some talks at meetups and conferences. Yes, and I also like drawing. So I try to illustrate my blogs with some drawings.
Charles Max_Wood:
So, looking at this blog post that we found on Medium, did you draw that?
Maria_Korneeva:
Yes.
Charles Max_Wood:
That illustration? That's awesome.
Maria_Korneeva:
Thank you.
Charles Max_Wood:
Yeah, mine would be like a little stick figure. It'd be like, is that a human stick figure? So I'm impressed.
Maria_Korneeva:
Thank you.
Charles Max_Wood:
Very cool. Well, we got you on to talk about it. It says, how to proxy HTTP requests in Angular. And it was interesting because I mean, I remember using proxy servers when I was in college and stuff to get around the filtering that the university did. Don't tell anybody. I guess it's been 20
Maria_Korneeva:
Yeah
Charles Max_Wood:
years, so it doesn't matter anymore. But, you know, just stuff like that, you know, we all kind of think about different proxies and maybe have used something like CharlesProxy or something like that. it looks like you're not really doing that so much as actually building in kind of a proxy on your own end where you have like a fake backend and stuff. So do you wanna kind of give us a 10,000 foot view on what you're talking about when you're talking about proxying the requests? And then we can dive into why, and then we can dive into how.
Maria_Korneeva:
Sure. Actually, I was really surprised that you addressed this topic because, and I was really surprised by myself when I discovered this topic for myself, when I started to write this blog. Because I joined a project and everything was working fine. And then I started to dig deeper and deeper. And then I discovered that they're using those proxies as a proxy configurations. And then I started to explore this topic and trying to understand why do we need those proxies at all. Because actually, in the basic tutorial in Angular, you won't hear about it. But this is so basic and so, well, really useful that I think everyone should know how to proxy those requests to work with back end, to work with localhost back end, to work with different environments, to work with. fake backend, et cetera. So there are so many use cases, and the functionality is really elementary. So that was my motivation why I wrote this. And then I was really surprised that you discovered it, and they wanted to talk about it. That's for the teasing, as a teaser, is the motivation for the talk.
Charles Max_Wood:
Yeah, well, it makes sense. And if you kind of read through it, you'll get an idea. Oh, this is pretty useful. But why don't you tell us, what do you use this for? Where does this approach come in for you?
Maria_Korneeva:
Actually, in the current project, we're mostly using this with a fake backhand. We're using a library called JSON server. This is a pretty
Charles Max_Wood:
Uh-huh.
Maria_Korneeva:
well-known one. And this is actually a very useful one. I recommend it to everyone. This is not like a commercial or something. It's really just my favorite library in a sense. And Once you fake backend, you also want to have a switch because you don't want to occasionally deliver this to production with some fake backend connections. I guess you won't. And that's why you need something which is pretty easy to switch to use so that you say, okay, once I start my application with some particular flag, I'm using the fake backend. And once I start the application normally without any flags, then I just go to the normal server. And this is how the proxy works in this use case. We set an environment variable to true, which like fake backend variable. And in my proxy, if we would get, we read this variable. And if it's set to true, then the proxy gets activated. And then all my requests go to the fake backend. And if the variable is set to false, then it's not proxied to some fake backend. It goes to the server. The advantage of this approach is that I don't have to care about, I don't have to worry about those switches in production because they're just not there. And I don't have to change anything in my code, like in the code that I write for the applications. Just the configuration of the proxy, which comes additionally to the application.
Charles Max_Wood:
Right. Yeah, that makes sense to me. You run it in production without any flags. And so it just
Maria_Korneeva:
Exactly.
Charles Max_Wood:
connects to the regular backend. But yeah, on your machine, you can stand up the fake backend and then you just tell it, hey, use this config.
Maria_Korneeva:
Yes.
Charles Max_Wood:
And yeah, you know, this is something that I think we all run into at one point or another in our career, right? Where it's, hey, look, you know, I need to be able to control. what I'm getting out of a database or from a backend or from some service or some API or whatever you want it to be. I need to know how this behaves under this circumstance, the other circumstance, and the other circumstance. If you can stand up a fake backend that has all of your different use cases in it, then yeah, you can just move around your app and make it behave in the way that you want and make sure that you're... what you're seeing is what you're expecting.
Maria_Korneeva:
Yes, absolutely. Well, consider several approaches. Of course, you can just mock your data in your component or in your service,
Charles Max_Wood:
Mm-hmm.
Maria_Korneeva:
but then you change your code. You can also have some switches in your code checking for the environment. But again, this is the functionality which does not contribute to the app functionality. This is not a business logic that you're writing. And any switch, any additional check for some development environments introduces in security threat. So I prefer not to have any switches in my code, directly in my code, but rather solve it via some configurations.
Charles Max_Wood:
Yeah, that makes sense. I could also see this as a convenient way to, for example, if I'm running into a bug in production, I can effectively copy the payload into this fake backend and then say, do your thing, and just see what happens.
Maria_Korneeva:
Yes, actually, yeah, sorry. There are a couple of more use cases for fake backend 2. In my current project, we have some really rare test user combinations. And to get there, we need to wait for the real test users for weeks, which, well, slows down the development tremendously. That's why we just can configure those test users in our fake backend and get them immediately. The same is valid for some days that we so that we just get some really rare combinations, the 29th of February in September.
Charles Max_Wood:
Right. Yep. The other one that I can see that you could play with is time zones.
Maria_Korneeva:
Yeah.
Charles Max_Wood:
Go ahead, Subra.
Maria_Korneeva:
Yeah, I tested interceptors to, however, I know myself, I always forget to comment it out and to change this, to switch to the real interceptor. And then I'm always afraid to deliver something to production, which just doesn't do what it's supposed to do. Yeah. Yeah, but you're right that using the fake back-end is a way to decouple. those two and I don't have to wait for the real implementation. I don't have to wait for my colleagues to ship the backend. I can work
Charles Max_Wood:
Mm-hmm.
Maria_Korneeva:
with it if I have this regular definition that's enough for me and then I can spin on a fake backend and then just work with this till it's ready. Yeah, that's true. And the threat is also a certain risk to derive too far away from the real data. Once you stay with some desired values, you develop differently. You don't check for nulls. You don't check for undefined, because in your data, you always get something. And then there is a big surprise when you switch to the real server. service and then you get some other data which you haven't predicted. But yeah, those are the downsides of a fake backend. Mm-hmm. Hmm. Mm-hmm. Yeah, that's especially if you use nodes and JS and backend and see really easy to use the same type definitions for both frontend and backend. But proxying, like we were talking about proxying in the beginning, actually working with a fake backend is just one of those use cases. This is the one that Charles you... asked me what I'm using now. So this was the major use case in my project, so working with the fake backend. However, that's also useful for effortless switching between the environments, because normally you wouldn't introduce the whole URL in your HTTP request. It would work rather with the relative paths. so that you have your test environment, staging environment, and production environment slash API slash users, for example.
Charles Max_Wood:
Mm-hmm.
Maria_Korneeva:
And proxying to the particular environment allows you to get your data when working on local host. This is also what we use in our current project setup, so that when we work on local host, when I'm developing some features, I proxy my request environment and I get the real data from our service which is deployed there. And then once I'm ready, I deploy my application in the test environment. And since I'm using the relative pass that's still working and once the tests are through and once I deliver it to the staging environment, I don't have to change the code of the application itself because I still the code still has those relative URLs. So then, again, there is no changes needed. And the only thing that I have to set up is the Angular JSON file, where I say that for the development mode, you use another proxy configuration. And for the staging, another one. And for production, one more. So yeah.
Charles Max_Wood:
Nice. Um, now you mentioned something about swagger. So we're using open API slash swagger set up for this. And does this work for other types of things like graph QL or. You know, some other crazy setup where I'm just making up my own endpoints with dot Jason at the end.
Maria_Korneeva:
Yes, you have the possibility to define some endpoints using wildcards so that you say all the requests that have API in the path or all the requests that have some particular values there will be proxied somewhere else. So
Charles Max_Wood:
Okay.
Maria_Korneeva:
you have the opportunity to filter, you can use just a list of them. You can also have some as I said some regex expressions. You have even the opportunity to rewrite the path so let's say you can work locally with something like slash API slash Foo slash bar and then you have the option to rewrite Foo slash bar and Remove it from the path to proxy to some server. So you also have more options what to do with with your requests.
Charles Max_Wood:
That makes sense. So effectively then I can say, yeah, proxy to my crazy setup where I just made up the path names and it'll,
Maria_Korneeva:
Yes.
Charles Max_Wood:
it'll map it however I tell it to.
Maria_Korneeva:
Yes, and if you're even more crazy, you can set secure to false, and then you can even switch off HTTPS off, which is particularly relevant if you are working on local host and plan to send your request to the server, to the service which is deployed in the test environment. Because usually, they won't like it if they get some cross-origin request from local host. But if you proxy it with the configuration of a secure set to false, then you can effectively switch it off.
Charles Max_Wood:
Makes sense to me.
Maria_Korneeva:
Yeah, that's another use case as a side like when developing on local host, I usually have the following the configuration of setting it to secure to false and then setting the context like putting all the API's all the URLs that I need for my request in the context and then specify the target. which is the environment where I want to proxy my request to.
Charles Max_Wood:
And when you're running your test, do you stand up a fake back end for that too then? Or do you... Is that
Maria_Korneeva:
For-
Charles Max_Wood:
only on the end-to-end tests? Or yeah, do you use this in testing at all?
Maria_Korneeva:
For the unit tests, we have the HTTP testing module, which Angular provides. So I usually take this one. And for end-to-end tests, the application is already deployed in the development or staging environment. And there's usually proxy to the same
Charles Max_Wood:
Okay.
Maria_Korneeva:
origin. So I don't have to proxy there. Basically, you need a proxy always when you are not in the same environment where your service is.
Charles Max_Wood:
Okay.
Maria_Korneeva:
Yeah. So we've covered the local development and proxying this to some deployed service. But sometimes you also have your back end with you, so in the same Monorepo. And then you have your back end running on localhost 3000 and your Angular app running on localhost 4200. And you can also proxy your requests the backend URL because you need to change the port otherwise it wouldn't work. So this one is another use case where you can use proxy. Yes. Mm-hmm. I think we've lost Suprad.
Charles Max_Wood:
Yeah, I think he froze.
Maria_Korneeva:
Did you get the final question? Like what was the last question he asked? Or was it a question Joel?
Charles Max_Wood:
I think it was a question, but I didn't quite catch it. So we'll have to have this edited, and then we'll... In fact, let me mark it. Umm...
Maria_Korneeva:
Shall we continue or shall we wait till he's back?
Charles Max_Wood:
We can keep talking.
Maria_Korneeva:
Okay.
Charles Max_Wood:
And then when he comes back, he can ask his question. So one thing that I was going to ask is, you know, what are the other approaches to solve this problem? And why did you pick this one over the other ones?
Maria_Korneeva:
Well, the straightforward approach for proxying the request to the local host backend or in general
Charles Max_Wood:
Uh huh.
Maria_Korneeva:
what
Charles Max_Wood:
Just in general
Maria_Korneeva:
other. In general,
Charles Max_Wood:
to just,
Maria_Korneeva:
you.
Charles Max_Wood:
yeah, yeah, to kind of get some sanity and control on your backend.
Maria_Korneeva:
What you can also do, you can work with the environment files in Angular, because these are also configurations that you can,
Charles Max_Wood:
Mm-hmm.
Maria_Korneeva:
and they are meant to store your environment configurations so that you can place your URL, like environment-specific URL, in there and reference it in your HTTP request so that you will just import a production URL, base URL, and then slash API slash users. That would be another option how to do this. And this is also what Angular offers. This will solve the problem with deploying the same code in different environments. However, it won't help with fake backend. And it won't help. No, it will help with start with working with backend on localhost. That's not a problem. But as I said, it's then, well, for the fake backend, you will still need to proxy it somewhere. So it will solve some problems. Exactly.
Charles Max_Wood:
Right, that
Maria_Korneeva:
There
Charles Max_Wood:
makes
Maria_Korneeva:
is
Charles Max_Wood:
sense.
Maria_Korneeva:
the last use case. And this is really rare. But we are also facing those problems. Or this is our use case in the current project too. We have a huge monorepo and we have different styling of our applications. We have several brands which belong to the same company and we have to style them according to the corporate identity of this brand. And
Charles Max_Wood:
Mm-hmm.
Maria_Korneeva:
that's why our styling comes from different endpoints. And that's again the option for us to configure the proxy for each particular app. to go to the relevant, to go to the respective style source and get the respective styling. That's another option how we can have the same code and then style it in a different way, depending on the proxy configuration.
Charles Max_Wood:
Gotcha.
Maria_Korneeva:
That's why, as I said, it was so... I was surprised by myself when I discovered that we're doing this, but we're implementing those proxies and using this configuration, which is so basic, and it took me so long to discover this concept, and that this concept does not come in the very beginning of the Angular setup. It is mentioned in the documentation. It is part of... building and serving Angular apps under Angular tools. But it took me a while to discover this section in the documentation.
Charles Max_Wood:
So... I mean, are there other tricks to this or is it just as straightforward as it looks? You set up your JSON server, you set up your config to point stuff to it and then make sure your backends are giving you what you need. I mean, is it really that simple or are there other tricks
Maria_Korneeva:
It is,
Charles Max_Wood:
that
Maria_Korneeva:
it really
Charles Max_Wood:
make it,
Maria_Korneeva:
is.
Charles Max_Wood:
are there other tricks that make it, I guess more robust or give it more, I don't know.
Maria_Korneeva:
Actually, it is that simple. It is some native capability of Angular. So we are not talking about some work around. This is the solution that the Angular team offers. Angular uses Webpack, and Webpack relies on the HTTP middleware package under the hood, which means this is also something which works out of the box. We just need
Charles Max_Wood:
Okay.
Maria_Korneeva:
to configure it properly. to set up the file, to reference it in the Angular JSON, and then we're good to go.
Charles Max_Wood:
Cool. Now, Subrat was trying to ask a question when he dropped off. Subrat, what was your question?
Subrat_Mishra:
Yeah, what I was asking is if you are using test container to test our maybe integration test which will run our Docker on the on the go while while running our test. So my question is, is it possible to set the port the runtime in the proxy to which port it will going to hit while while you are running the test.
Maria_Korneeva:
I'm just checking the documentation because in all the examples I said that the target, and we are talking about the target of our proxy, that was the string that they used. So they just provided this statically. I need to double check if it's possible to provide a function instead of target. And if it
Subrat_Mishra:
Mm-hmm.
Maria_Korneeva:
is possible, if it works then that should work. with different ports too. As of now,
Subrat_Mishra:
Yeah.
Maria_Korneeva:
I don't see any example of the function being called on there, but since this is a normal package, which provides a lot of options, I'm actually quite positive that you should be able to configure it like this. So you just need a function which will get the port and then will return the whole target URL. which you provide in the configuration.
Charles Max_Wood:
Oh, interesting.
Subrat_Mishra:
Yeah.
Charles Max_Wood:
Yeah, usually I'm using Docker Compose, so I would imagine that you could also put it into an environment variable and then just...
Maria_Korneeva:
Yeah, that would
Charles Max_Wood:
You
Maria_Korneeva:
work
Charles Max_Wood:
know...
Maria_Korneeva:
too. That's actually
Charles Max_Wood:
Yeah.
Maria_Korneeva:
a very good point because in your proxy configuration, you can read the environment and variables and then you can just use this
Charles Max_Wood:
Yeah.
Maria_Korneeva:
part of the target. Problem solved. Perfect.
Charles Max_Wood:
Right.
Subrat_Mishra:
Mm-hmm.
Charles Max_Wood:
Yeah, so then you just say, hey, use this other container on this port.
Subrat_Mishra:
Mm-hmm.
Charles Max_Wood:
in the environment variable. But yeah, it'd be interesting to see if you could, yeah, make it dynamic. So. Very cool. So anything else that you're working on that you wanna tell us about before we move on to the next segment of the show?
Maria_Korneeva:
Um, maybe just to mention, we were talking about all this fake backend, um, store stuff, um, which is relevant for our, for the developers. But I noticed that we have this privileged position of faking our data as we want being
Subrat_Mishra:
Okay.
Maria_Korneeva:
front end developer, but
Charles Max_Wood:
Mm-hmm.
Maria_Korneeva:
our testers don't, and that's usually like, it's just, it's It's a pity. Like, you know, I was able to test it. But for you, you have to wait for your test users. And you have to wait till
Charles Max_Wood:
right?
Maria_Korneeva:
you can test my application. That's why I really like the solution my colleagues came up with where they wrote a script which runs on some middle layer, let's say,
Charles Max_Wood:
Mm-hmm.
Maria_Korneeva:
APEC or anything that you have between your servers and outer world. And their script. runs there and checks for the headers or for the cookies. It's up to you what to check. And then you can set those headers or cookies in your browser. The tester can do this and configure the desired outcome or the desired response of the server, being it's 404 or some mock data which is required for this test use case. And the script does the following. It looks at the cookies or the header. And if it sees some particular value in there, the script knows that this script should not be proxied to the server, to the actual server. It will directly response with the values that are provided in this cookie so that it looks, for the application, it looks as if the server responds with the error response or with some desired data. And I think this is also really important because it's being able to develop fast to mock data as a developer is just one half of the whole process. And that's what I really like about this script or this idea that you can also give your testers some more options. And the same is valid for some proxy. Another colleague of mine wrote a proxy. In a different context, we're out of the Angular application there, but it doesn't matter. And there was a proxy which would check the headers and do the same. So it wouldn't even reach any middleware layers out there. It would just stop at the application layer in the browser and go back with some desired response. So this is another aspect of the whole mocking data story.
Charles Max_Wood:
Yeah, I've seen a couple of approaches to this. One is what you're talking about where you either intercept the signal coming in and just give the response that you want. I've also seen systems. I mostly do backend development actually in
Maria_Korneeva:
Yeah.
Charles Max_Wood:
Ruby on Rails. We have a seeds file that
Maria_Korneeva:
Mm.
Charles Max_Wood:
will see data into your database. You could set up a... Basically a testing seed and then, you know, based on your environment, you know, you just run the seed and it just, you know, populates the data you want. You have to maintain that, but you have to maintain any other automation or script that you run anyway. But yeah, I mean, however that works, there are a lot of ways to do it. It's interesting though, just to kind of think about, yeah, you know, you could slide something in that middleware and manage what you need. I've also seen people do it with an actual proxy system like Charles Proxy or something. because then again, they can put the response that they expect to send back. That doesn't quite get you end to end because your backend may have a bug,
Maria_Korneeva:
Hmm?
Charles Max_Wood:
you know, may do something you don't expect, but you know, if you're just making sure that the front end reacts properly, yeah, there are a lot of ways to do it. But it sounds like you've got an elegant solution there. So. So,
Maria_Korneeva:
Yeah, I really like it because our testers are happy and the more the testers can test during the test phase, the less bugs in production we have,
Charles Max_Wood:
Mm-hmm.
Maria_Korneeva:
the better I can sleep on Friday night.
Charles Max_Wood:
Makes sense. Yeah, I write bugs all the time. Subrata never does, but you know,
Maria_Korneeva:
Yeah.
Charles Max_Wood:
it's a constant battle
Subrat_Mishra:
You know
Charles Max_Wood:
for
Subrat_Mishra:
my
Charles Max_Wood:
me.
Subrat_Mishra:
bugs always comes on Friday night.
Charles Max_Wood:
Oh, there you go.
Subrat_Mishra:
It will always like once you thought that this weekend will be good and someone
Maria_Korneeva:
No.
Subrat_Mishra:
will call like there is a bug in production.
Charles Max_Wood:
Yep.
Maria_Korneeva:
Ooh! Hehehehe
Charles Max_Wood:
Yeah. We ordered your favorite pizza. Get into the office.
Subrat_Mishra:
Yeah.
Charles Max_Wood:
All right. Well, let's go ahead and wind down. I'm really curious before we do that, if people want to follow anything else that you're writing or ask you questions
Maria_Korneeva:
They
Charles Max_Wood:
about
Maria_Korneeva:
can
Charles Max_Wood:
this, how do
Maria_Korneeva:
ping
Charles Max_Wood:
they connect
Maria_Korneeva:
me on
Charles Max_Wood:
with
Maria_Korneeva:
Twitter.
Charles Max_Wood:
you online?
Maria_Korneeva:
I'm at browser person on Twitter. So drop me a line. If it's more professional, you can connect via LinkedIn. It's Maria minus Corneva. So I'd be happy to connect.
Charles Max_Wood:
Very cool. All right. Well, let's go ahead and do some picks then. Now, picks are just things that we're shouting out about. And so I'll have Subrat go first. Subrat, do you have some picks?
Subrat_Mishra:
Yeah, I think this week picked also a book I have started reading. It's a famous book, like Sapiens, a brief history of humankind. It's a pretty thick book. I have started reading of how, how humankind evolved and those things. So I think that should be someone, if you're getting
Maria_Korneeva:
Mm-hmm.
Subrat_Mishra:
time apart from coding, then you can go and read it. It is a good book. Apart from that, I will try to pick another book which I already picked maybe twice.
Maria_Korneeva:
Mm-hmm.
Subrat_Mishra:
It's a psychology of money. It's a pretty, pretty good book. I keep coming back to the book just to thought about like how it should think about money. It's not, not everything times matter. Money matters. Like everything matters in life. So that's how the perspective towards money will change. That's a two pick for this week.
Charles Max_Wood:
Awesome. I'm gonna jump out there with a couple of picks. I usually do a board game pick, but I haven't really been playing board games much lately. Trying to get my group of guys that I play with back together to play. And so I don't know that I have a new game to throw out that I haven't already picked. So I'm just gonna forego that for a minute. I'm gonna put up a couple of other picks that I have. First of all, I've been talking to a friend of mine and he's been helping me kind of get some branding stuff together, which has been awesome. And so I've kind of gotten back on the email bandwagon and stuff like that. So I'm gonna throw out some of the things that I'm using to connect with people and I'm gonna be integrating all this into Top End Devs. So if you want to get some of the stuff that I'm talking about that, you know, we'll have it there. One of them is ActiveCampaign, which is an email system so that I can send emails out. I'm planning on just putting out content and putting that stuff together. I've also basically gotten things together for top end devs so that I can start doing video series and courses. So I'm going to be putting out a course on how to stay current. because I get asked that all the time. How do I stick around on stuff? The other thing that I'm also gonna be putting out is a course on, or a series rather. So one of the things that really helped me when I was coming up as a developer was there was a series called Rails Casts. And what it was was, what's his name? It'll come to me in a minute. Anyway, the guy that was putting it together, he... He did a video every week about some aspect of Rails. And I'd like to do that for all the different shows that we have, right? So I'd like to have one for Angular, one for React, and one for Ruby, and one for JavaScript. And I'm probably gonna do some of them, probably gonna be enlisting people to do the rest of them. So if you're interested in doing it for React, or for Angular, sorry,
Maria_Korneeva:
Yeah.
Charles Max_Wood:
not React. I haven't been on the React show for a while, a long while. But if you're interested in doing it for Angular, let me know. We're also doing an Angular remote. conference in November. So if you want to speak at that, the CFP is open. And you can buy tickets for it right now. And it's a good time to kind of go to your boss and say, hey, look, this is a great way for me to kind of connect with other people and level up and know what's going on in Angular and stuff like that, especially if you couldn't make it to ng-conf, which actually is going on as we speak. But yeah, you know, it's just another opportunity for you to get to interact with people. The system we're using allows you to actually join conversations
Subrat_Mishra:
Thanks for watching!
Charles Max_Wood:
with people and talk to them, kind of like how we're talking from Utah, India, and Germany, right, over a video. It has tables and it allows like eight people to get on and do a video, voice chat, talk like this. So we're going to have a robust hallway track. And then if your company is hiring or something and you want to sponsor and kind of get your name out there, that's a good way to go too. But anyway, that's just kind of the stuff I'm using there. Like I said, the email marketing system is active campaign. The texting system that I'm setting up is on community.com. And the phone number will also be on the website. You have to have a U S number, I think. US or Canada. I think they're working on getting into texting systems for the other countries, but I don't think they're there yet. And then the system we're using for the conferences is called AirMeet. That's A-I-R-AirMeet. And like I said, we're going to have networking sessions in the whole nine yards. But I'm really excited about all this stuff. It feels like it's finally coming together. I've got this vision of where we're going to be. we can get to with this stuff. And ultimately, what I'm about is I really just want to help people, hey, look, whatever your career is that you're kind of dreaming of, whether it's I want to be the CTO of a startup that goes big or I just want to be a senior developer and then go hiking in the afternoon and anything in between. I want to be an influencer with a podcast or a blog and I want to help people that way. I want to give you the resources that you need in order
Subrat_Mishra:
Thank
Charles Max_Wood:
to
Subrat_Mishra:
you.
Charles Max_Wood:
do that.
Subrat_Mishra:
Have
Charles Max_Wood:
And I feel
Subrat_Mishra:
a nice
Charles Max_Wood:
like,
Subrat_Mishra:
day.
Charles Max_Wood:
uh, kind of serving some of these technical skills needs. Is there, but then the other thing is, is I want to provide people with the coaching and, and content that's going to help them go, okay. Um, I know I need to level up on how I talk to my coworkers. So I'm going to do a course on that. Right. Or, um, I need to know how to, uh, lead a team. Right. because I'm kind of at that place where I'm starting to become a team lead. And I want to put that stuff together so that whatever it is that you're dreaming you want, you can have. And in the meantime, I'm also doing some coaching. So if you go to topendevice.com slash coaching, you can sign up for some of that stuff. Um, what it'll do is it'll actually, you fill in the form and then you'll get a link where you can schedule a half hour call
Subrat_Mishra:
And
Charles Max_Wood:
with me
Subrat_Mishra:
you start
Charles Max_Wood:
and we'll just talk through what you need
Subrat_Mishra:
to wonder, wonder.
Charles Max_Wood:
and then we'll figure out how we can do weekly follow up to get you where you want to go.
Subrat_Mishra:
Thank you for watching.
Charles Max_Wood:
plus any other content that I'm making for people. A lot of that will be focused around the questions people are asking and the coaching because I know how to address that. So anyway, and I've helped people through this stuff for years and I'm excited
Subrat_Mishra:
So,
Charles Max_Wood:
to be able to do it in a more focused way. But anyway, I have rambled long enough, but yeah, one of the things he did is he walked me through that visioning stuff and I've been fired up ever since then because I just keep thinking
Maria_Korneeva:
Wow,
Charles Max_Wood:
about
Maria_Korneeva:
I'm still so enchanted
Charles Max_Wood:
kind of what it
Maria_Korneeva:
by
Charles Max_Wood:
feels like and what it
Maria_Korneeva:
this
Charles Max_Wood:
looks like.
Maria_Korneeva:
inspirational
Charles Max_Wood:
So anyway,
Maria_Korneeva:
talk.
Charles Max_Wood:
Maria,
Maria_Korneeva:
So
Charles Max_Wood:
what are
Maria_Korneeva:
I have
Charles Max_Wood:
your
Maria_Korneeva:
prepared
Charles Max_Wood:
picks?
Maria_Korneeva:
two picks because I actually, I really like those live coding sessions with my business colleagues where they come with some ideas to me, like, you know, once they see the buttons, they wanna change the buttons. So we sit together and I just shift those buttons, change the color and... change the phone size, et cetera, so that we are co-creating our application. And then I realized why not give them this opportunity to do this by themselves? So my business colleagues have learned how to work with DevTools, which is a huge step forward. So they can change their, yes, they're a huge respect on them,
Subrat_Mishra:
Yeah, I know.
Maria_Korneeva:
because this way they can
Charles Max_Wood:
That's
Maria_Korneeva:
change
Charles Max_Wood:
cool.
Maria_Korneeva:
some. texts on the website because they can edit it in the developer tools. And recently I've learned that actually we have a browser API which enables this for everyone which is called document design mode. So once you switch design mode to on, like there is on and off and off is default, then you can change all the text data, you can delete all the elements from the website. Unfortunately you cannot add more buttons by yourself. But at least you can change all the text on a website without any additional tools. So it's quite easy to switch on this mode. And then the business guys can work with the website, change the wording. That's one pick that I'd like to introduce also in my team. And another one has been recommended to me today by one of our testers. This is a Chrome extension, which is called Tweak. Mark and Modify HTTP requests, which fits to our topic. And I find it really cool that our tester recommended this to me because he was so excited that this tool, this extension helped him a lot working with HTTP requests and doing what we were discussing before. So this is something which enables our testers to test my software and gives me more time my coding instead of supporting the testers and providing something, some tooling for them, how to mock requests. They have this extension and they can work with us. I can provide the links to both of my picks, the documentation of the API and the link to this extension, but those tools are for me something which helps my team members to win the whole development process, and I like it.
Charles Max_Wood:
That's awesome.
Maria_Korneeva:
Hahaha
Charles Max_Wood:
I might have to pick your brain and
Subrat_Mishra:
Yeah,
Charles Max_Wood:
share it with people on how you get the business people
Subrat_Mishra:
that's
Charles Max_Wood:
into
Subrat_Mishra:
a pretty good job.
Charles Max_Wood:
dev tools.
Maria_Korneeva:
Hehehe
Charles Max_Wood:
Cause you know, cause that level of collaboration is really hard to get. And you know, not that they have to learn how to code necessarily, but just
Maria_Korneeva:
Yeah, it helps a lot. It
Charles Max_Wood:
so
Maria_Korneeva:
helps
Charles Max_Wood:
that they
Maria_Korneeva:
really
Charles Max_Wood:
can
Maria_Korneeva:
a
Charles Max_Wood:
kind
Maria_Korneeva:
lot.
Charles Max_Wood:
of, they can get their fingers on what's actually going on.
Maria_Korneeva:
Mm.
Charles Max_Wood:
Yeah. Yep. Yeah, I mean, that's ultimately what it's about, right? It's that communication, that level of communication you get. Very cool. Well, we'll go ahead and wrap it up. This was awesome, Maria. Thank you so much for coming and sharing with
Maria_Korneeva:
Thank
Charles Max_Wood:
us.
Maria_Korneeva:
you for having me. It was fun.
Charles Max_Wood:
And yeah, I had no idea that this proxy stuff was even built into Angular. So. All right, well, we'll wrap it up here. Till next time, folks, Max out.