TheFrontEndπŸ”₯
10.8K subscribers
275 photos
56 videos
8 files
532 links
πŸ“ Articles
πŸ—ž News
πŸ‘“ Tutorials
πŸ€” UI/UX thoughts

on front endπŸ’‘ mobileπŸ“± and web dev πŸ–₯

Admin: @masant1
Download Telegram
This media is not supported in your browser
VIEW IN TELEGRAM
The whole story of JavaScript from 1996.

This is super interesting, guys. I'm sure many of you havent been around when it all started.

Definitely give it a read πŸ”₯

https://www.jetbrains.com/lp/javascript-25/
​​Game dev from inside out

As we are approaching the end of 2020 (and hoping that 2021 will be a bit easier on us πŸ˜‚), I can only recommend to those who are looking to have some interesting read there is a really cool series of building Crash Bandicoot from Andy Gavin (lead developer and designer of the game)

It's pretty long, but extremely interesting.

I'm gonna just quote our CTO here (a really bright individual) regarding those articles:

"This series is the primary reason why I do all this"

https://all-things-andy-gavin.com/2011/02/02/making-crash-bandicoot-part-1/
This media is not supported in your browser
VIEW IN TELEGRAM
Spreadsheet on steroids

Heard of airtable? If you can use github, you might as well get this whole thing for free.

Just found of https://firetable.io/

Pretty much the same thing build on firebase (you know it mostly free unless you have thousands of users)

Don't thank me (I know you wouldn't πŸ˜‚)
This media is not supported in your browser
VIEW IN TELEGRAM
Hooks

Thanks god they came in. I'm one of those people who always like to break components apart to make it reusable and small.

Quite often I noticed that functional components still want some state to be togglable. This used to be a pain as you either have to transform to class or play football with passing stuff from and to child / parent components.

And now it's all about

const Child = ({prop1, prop2}) => {
//useEffect

return smth
}

As a benefit setLoading(false) is much more concise than
this.setState({ isLoading: false})

https://link.medium.com/GjcKRVVlxcb
font-weight: 300 considered harmful (and a fontconfig workaround)

https://work.lisk.in/2020/07/18/font-weight-300.html
That's 3 years of this channel at a glance

Thought I'd share
A good list of tips and advices for your React development

https://www.telerik.com/kendo-react-ui/react-best-practices-and-productivity-tips/
I was forced to ask you a question. Do you guys use tiktok? If you want to discuss welcome to our chat.
Anonymous Poll
13%
Yes. I use tiktok.
84%
No. I don't use tiktok.
3%
Other (explain in chat)
This media is not supported in your browser
VIEW IN TELEGRAM
Video calls in apps

Will soon be adding video calls in our app at work.

Found Twillio that seems pretty smooth and straightforward to use for my case.

Also with React Native wrapper.

Was it so hard, telegram? πŸ˜‚

Has any of you guys use that? Mind sharing your experience with the community? Any pitfalls? Things to look out for?
Talking about useful APIs for your next pet project

Printful - Lets you upload designs, preview items, and then order almost any type of merchandise via API. Printful handles shipping and manufacturing

Mux Video- Handles all the complexity of working with video, just upload the file and Mux creates multiple versions of it and pushes to a CDN. Also supports live streaming

Lob - Lets you send postcards, letters, checks, and more with a few lines of code

Twilio - Already well known for SMS, but they've expanded their product range a ton and have a bunch of new features to play around with

Plaid - Makes it easy to connect to users bank accounts and takes care of security and regulations

Google Cloud AI - Could have put a few different companies here but I like Google's AI APIs because they give you $300 in free credit, plus most people already have a Google account so sign up is easy

Coinbase - Free public API for real time crypto price data via websocket, also historical data. With an account you can place orders if you wanted to make a trading bot

Open Secrets - Provides data on pretty much any politicians in Congress, voting records, fundraising, and lobbying

New trading bot anyone? Btc is at 30kπŸ˜‚

PS found this list on reddit
Did you know one of those website you visit in incognito mode actually removes jQuery and adopts Vue.js?

Interview with their Web developer

Regardless what you think, the dev work there is one of the toughest with the amount of users and graphical content they have to deal with.

Pure science πŸ”₯πŸ’¦
To those struggling with all that new Web dev noncence like React with those CSS in JS πŸ€·β€β™‚
Are you using arrow functions in your React apps?
Are you using arrow functions like in the above screenshot?
Anonymous Poll
55%
Yes.
22%
No.
22%
See results.
TheFrontEndπŸ”₯
Are you using arrow functions like in the above screenshot?
OK, most of you used this approach and don't see why it can be debatable (although a few mentioned in comments several concerns, well done).

The reason I pointed this one out is because doing this often is a bad idea.

I failed to compile a list of articles and proper explanation, but all I want to point out here is that using arrow functions in React in this way can cause you rendering problems when your app grows. You should use it very carefully with paint flashing in browser to ensure you don't render unnecessary things.

The main issue is that a lot of react tutorials online teach you to do this and a lot of even senior frontend devs do that (to a point where it starts causing problems, trust me I've seen it too many times). The main explanation being: "well why not, it's documented that it's fine to do so here and here" .

I suggest researching why this is not always good (since I'm terrible in finding time to explain and write a proper post).

You can start with the below article that goes into explaining this one (but please go further in your research, testing it yourself is the best way):

https://www.freecodecamp.org/news/why-arrow-functions-and-bind-in-reacts-render-are-problematic-f1c08b060e36/