Omansh-part3 #6
Omansh-part3 #6
Conversation
Apply Sweep Rules to your PR?
|
|
Kudos, SonarCloud Quality Gate passed!
|
| const handleClick = () => { | ||
| fetch("http://localhost:8000/api/super_cool_awesome_endpoint") | ||
| .then((response) => response.json()) | ||
| .then((data) => { | ||
| setResponseText(data.message); | ||
| }) | ||
| .catch((error) => { | ||
| console.error(error); | ||
| }); | ||
| }; |
There was a problem hiding this comment.
Very good use of the JS/TS idiomatic syntax for API stuff! This is excellent and shows understanding of proper client/server interaction.
FYI: I've also seen others leverage the "RTK" framework (this is on the Redux side), but this implementation will suffice for the purposes of the beginner project
| const styles = { | ||
| container: { | ||
| display: "flex", | ||
| flexDirection: "column", | ||
| justifyContent: "center", | ||
| alignItems: "center", | ||
| height: "100vh", | ||
| }, | ||
| btn: { | ||
| appearance: "button", | ||
| backgroundColor: "#000", | ||
| border: "1px solid #000", | ||
| borderRadius: "4px", | ||
| boxShadow: "4px 4px 0 0 rgba(255, 255, 255, 1), 4px 4px 0 1px #000", | ||
| boxSizing: "border-box", | ||
| color: "#fff", | ||
| cursor: "pointer", | ||
| display: "inline-block", | ||
| fontFamily: "ITCAvantGardeStd-Bk, Arial, sans-serif", | ||
| fontSize: "14px", | ||
| fontWeight: "400", | ||
| lineHeight: "20px", | ||
| padding: "12px 40px", | ||
| textAlign: "center", | ||
| textTransform: "none", | ||
| touchAction: "manipulation", | ||
| userSelect: "none", | ||
| WebkitUserSelect: "none", | ||
| whiteSpace: "nowrap", | ||
| }, | ||
| msg: { | ||
| marginTop: "20px", | ||
| fontFamily: "Pacifico, cursive", | ||
| fontSize: "24px", | ||
| }, | ||
| }; |
There was a problem hiding this comment.
good that you included the css here for scope purposes. Normally, we would want to centralize our css into a .css file, but I didn't expect that for this task. Cool style/font by the way
|
@Omanshb great great work on this. I love how the code for this is very clean and shows understanding of the JS/TS client/server convention. Cool font by the way for the |
Here are all of the changes I made for part 3 of the beginner project. I have also provided a screen recording for my functional endpoint.
https://drive.google.com/file/d/1mNUJW_1mDd0JA4TNmosEgteb8Z-2AHJD/view?usp=sharing