A New Way to Write React

Ғылым және технология

Yeah, you can write React using CSS now. But should you? This highly experimental package generates valid, type-safe React code from CSS files and, in doing so, encourages a very specific style of coding not everybody will like.
-- my links
newletter: www.joshtriedcoding.com/
discord: / discord
github: github.com/joschan21

Пікірлер: 143

  • @joshtriedcoding
    @joshtriedcoding2 ай бұрын

    who wants to start developing NextCSS with me

  • @ShubhamShubham-gg9fj

    @ShubhamShubham-gg9fj

    2 ай бұрын

    Up for this 👍

  • @ekchills6948

    @ekchills6948

    2 ай бұрын

    Mee

  • @labhamjain3915

    @labhamjain3915

    2 ай бұрын

    2 days from now : "Introducing Astro.css" build full stack app just using css

  • @user-el9tg4tu6v

    @user-el9tg4tu6v

    2 ай бұрын

    mee

  • @ayanahmad4

    @ayanahmad4

    2 ай бұрын

    I'll be glad to be part of this 😊

  • @sagarchavan5894
    @sagarchavan58942 ай бұрын

    A solution to a problem which at first place never exist.

  • @chibuzoekwue

    @chibuzoekwue

    2 ай бұрын

    Exactly 👍

  • @brayancuenca6925

    @brayancuenca6925

    2 ай бұрын

    well it’s cool to know it’s possible

  • @winfredj9820

    @winfredj9820

    2 ай бұрын

    moved to svelte. life has been better

  • @EmmanuelOdii80

    @EmmanuelOdii80

    2 ай бұрын

    Agreed.

  • @BradySie-wo6vf

    @BradySie-wo6vf

    2 ай бұрын

    no lol this is actually so useful. imagine the conditionals you'd need otherwise with tailwindmerge etc etc and having to conditional all the variants, this approach makes things much cleaner 100%

  • @CoolPupGaming
    @CoolPupGaming2 ай бұрын

    React is a meme framework now

  • @21abdullah89

    @21abdullah89

    2 ай бұрын

    Yeah pretty much

  • @joshtriedcoding

    @joshtriedcoding

    2 ай бұрын

    hahaha yes and i love it

  • @CoolPupGaming

    @CoolPupGaming

    2 ай бұрын

    @@joshtriedcoding what are your thoughts on angular? 🤔

  • @TheSnHIMshow

    @TheSnHIMshow

    2 ай бұрын

    JS is a meme lang 😀😀

  • @te20ja04

    @te20ja04

    2 ай бұрын

    Haha😂

  • @WarSTRIKER1299
    @WarSTRIKER12992 ай бұрын

    "I'm a full stack css developer" "You mean TS or JS, right?" "You heard me correctly"

  • @sicario55

    @sicario55

    2 ай бұрын

    bruh

  • @atmosph
    @atmosph2 ай бұрын

    can't wait to see when we'll be able to create full-stack apps using only css

  • @rod6722

    @rod6722

    2 ай бұрын

    I'd rather have a SQL front-end powered by a separate CSS back-end.

  • @StabilDEV

    @StabilDEV

    2 ай бұрын

    Styled Postgres as a templating language is a MUST

  • @BarisPalabiyik
    @BarisPalabiyik2 ай бұрын

    I am probably not going to use this ever lol. But I love the options and creativity in our field.

  • @tvwithtiffani

    @tvwithtiffani

    2 ай бұрын

    Same. But seems like an easy way to get a language model or chatgpt to generate react components, after giving it a few examples. Think AI

  • @BarisPalabiyik

    @BarisPalabiyik

    2 ай бұрын

    @@tvwithtiffani yeah but it's pretty unorthodox, so it wouldn't be suitable for big production projects where you aim for the broad talent pool in the industry.

  • @unzoid
    @unzoid2 ай бұрын

    rico, reset the timer.

  • @azekeprofit
    @azekeprofit2 ай бұрын

    They best chance to integrate business logic directly inside CSS is using calc() expressions I now want to see it happen

  • @gabrielbianchi2246
    @gabrielbianchi22462 ай бұрын

    I’m thinking it’s crazy you took this seriously Josh😂

  • @ganeshkale9665
    @ganeshkale96652 ай бұрын

    first i think it's new so devin not get it but, then i realize devin can go through the documentation

  • @OneShore

    @OneShore

    2 ай бұрын

    What makes you think devin didn't come up with MistCSS?

  • @wavyboyjodii

    @wavyboyjodii

    2 ай бұрын

    😂😂😂

  • @ganeshkale9665

    @ganeshkale9665

    2 ай бұрын

    @@OneShore I think devin will forgive us,but he will not

  • @muhendisim

    @muhendisim

    2 ай бұрын

  • @user-jz4iz2qh9u
    @user-jz4iz2qh9u2 ай бұрын

    I like it. I love writing CSS and this binds the code to the style which is pretty neat.

  • @wlockuz4467
    @wlockuz44672 ай бұрын

    I did not expect a silly framework like this to promote Container/Presenter pattern which is actually a solid pattern.

  • @paglagamer8871
    @paglagamer88712 ай бұрын

    Next make a framework that can Build APIs with CSS only, Node.css

  • @bongbuincyril6150
    @bongbuincyril61502 ай бұрын

    Devin is waiting for u guys

  • @wlockuz4467
    @wlockuz44672 ай бұрын

    Never let JS devs cook.

  • @JakobRossner-qj1wo
    @JakobRossner-qj1wo2 ай бұрын

    I still dont understand why you want this seperation of concerns. 😅 You are using Tailwind and React. Wouldn't something like Angular be better for this seperation of concerns?

  • @Luxcium
    @Luxcium2 ай бұрын

    I can never watch those video without having the strong illusion that Josh is my friend and that I know him like in real life... Is it just me or anyone else have that strong impression that he is such a friendly person... Maybe I am just silly or something weird...

  • @thepaintedsock
    @thepaintedsock2 ай бұрын

    Interesting way to generate boilerplate typescript components quickly. Though I prefer to write css without a compiler to test on multiple browsers because nothing else is quicker than raw html and css templating. Once a layout is well tested then it cam be used in react land or other framework of choice.

  • @cedi2929
    @cedi29292 ай бұрын

    Does that mean we write Next with SCSS?

  • @genka14
    @genka142 ай бұрын

    Thought it was a joke at first, but actually quite cool

  • @ruggeddog3103
    @ruggeddog31032 ай бұрын

    hell noo

  • @geralt36

    @geralt36

    2 ай бұрын

    Exactly my reaction to this.

  • @PJlikePajamas
    @PJlikePajamas2 ай бұрын

    Pretty cool, I think I like the concept better than the application of the idea.

  • @Nab_001
    @Nab_0012 ай бұрын

    " People's creativity never stops "

  • @CoryTheSimmons
    @CoryTheSimmons2 ай бұрын

    These comments are the same people who laughed at Atomic.CSS (which went on to HEAVILY inspire Tailwind). Mist looks really interesting. One of the pain points of making React components are style variants... It just gets really messy. Mist seems to solve that. I think CVA might do this better.

  • @AbhiShake-pl3cf
    @AbhiShake-pl3cf2 ай бұрын

    I dont think i feel good having 2 files for same thing in the same places. Its like those initial transpilation old days where we had ts and transpiled js in the same place

  • @wavyboyjodii
    @wavyboyjodii2 ай бұрын

    I had to check if it was April 1st 😂

  • @MyCodingDiarie
    @MyCodingDiarie2 ай бұрын

    You're changing lives with your content. Keep inspiring!

  • @theyreMineralsMarie
    @theyreMineralsMarie2 ай бұрын

    This is actually not that bad. It just adds class names to components and generates types. If you style your react components using basic css and the className prop then this is really no different.

  • @labhamjain3915

    @labhamjain3915

    2 ай бұрын

    CVA already does it and it's better in my opinion than this

  • @theyreMineralsMarie

    @theyreMineralsMarie

    2 ай бұрын

    @@labhamjain3915 you're right, CVA is better. This "MistCSS" project is just an interesting alternative that simply shows the flexibility of JS/Typescript.

  • @buddy.abc123
    @buddy.abc1232 ай бұрын

    People are looking for problems that aren't there. We are nearing the singularity

  • @mjerez6029
    @mjerez60292 ай бұрын

    Ok, I'm moving to React now

  • @ashishsharma__
    @ashishsharma__2 ай бұрын

    It's interesting approach but I'm not sure I'm going to ever use it😂

  • @ahmedyarkhan7006
    @ahmedyarkhan70062 ай бұрын

    hey josh try mint with framer motion

  • @TheGryphon14
    @TheGryphon142 ай бұрын

    What's wrong with writing an actual react code?

  • @merveillevaneck5906
    @merveillevaneck59062 ай бұрын

    "perfect" DX but i have to fix imports manually 😂 all jokes aside tho this is not a bad take, but definitely needs a lot more tooling around it in order to be viable for a dev team to use

  • @BradySie-wo6vf
    @BradySie-wo6vf2 ай бұрын

    no but why is this actually so useful for creating generic components tho

  • @igorskyflyer
    @igorskyflyer2 ай бұрын

    Next framework: bring PHP into a React component

  • @thecodeinn
    @thecodeinn2 ай бұрын

    What problem does this solve??

  • @hoxtygen

    @hoxtygen

    2 ай бұрын

    Don't worry, it's about to be created.

  • @OneShore
    @OneShore2 ай бұрын

    Seems about right if you're already down the React rabbit hole.

  • @eduardo_assuncao
    @eduardo_assuncao2 ай бұрын

    Ow my gosh! The future is here 🤯

  • @nanoadam415
    @nanoadam4152 ай бұрын

    Is it only me or did anyone else think we were writing full on React logic in CSS

  • @coreydevs
    @coreydevs2 ай бұрын

    ima head out

  • @Smartercow
    @Smartercow2 ай бұрын

    It's too much unnecessary files. Seems cool tho if you want to separate css logic especially when using tailwind css but .module.css does accomplish with one less file

  • @ibrahimmohammed3484
    @ibrahimmohammed34842 ай бұрын

    now i've seen everything

  • @baldcoder_
    @baldcoder_2 ай бұрын

    Nope. Tailwind is still a better option for reusable components. This specifically solves a problem that Styled Components created. But there are other (better) options out there that don't have Styled Components issues and don't need you to write a file, generate another file, and keep your eye on the import path.

  • @griffadev
    @griffadev2 ай бұрын

    What an absolute travesty i hope this is a meme package

  • @81NARY
    @81NARY2 ай бұрын

    Nahh, who let the bro cook 😂

  • @wizz1e80
    @wizz1e802 ай бұрын

    Why ?

  • @irfansaeedkhan7242
    @irfansaeedkhan72422 ай бұрын

    its just over complicating things, its not a solution to any problem

  • @TheSnHIMshow

    @TheSnHIMshow

    2 ай бұрын

    Smaller git repos 🤣🤣

  • @ziyadtaleb
    @ziyadtaleb2 ай бұрын

    But why ?

  • @joe_j
    @joe_j2 ай бұрын

    Why don't you use windows 11?

  • @joe_j

    @joe_j

    2 ай бұрын

    So far at 4:50 I feel that so many steps to take to accomplish a very simple thing

  • @joe_j

    @joe_j

    2 ай бұрын

    Why dont they make one that reduces the number of files

  • @coolemur976
    @coolemur9762 ай бұрын

    Nah. In smal projects it's just too much hustle. And in big projects you just can't trust every developer to follow rules. There will always be someone who adds business logic into these generated files then removes .mist from file. And now you will have two patterns in same project which will be a headache to maintain.

  • @KrishnaJha25
    @KrishnaJha252 ай бұрын

    Damnnn!! ❤

  • @julianklumpers
    @julianklumpers2 ай бұрын

    One thing that is missing, is "AI"....... :P

  • @nattawodsatee4068
    @nattawodsatee40682 ай бұрын

    If it’s gonna generate the component for you. At least it should generate forwardRef instead of pray to new React to stop complaining about passing ref into function.

  • @joe-robin
    @joe-robin2 ай бұрын

    why ?

  • @Kay8B
    @Kay8B2 ай бұрын

    Ill stick to class-variance-authority and creating my own components. This seems abit..... ermmm redundant, gimmicky.

  • @RhythmRift74
    @RhythmRift742 ай бұрын

    very interesting but will never use that

  • @arxci9402
    @arxci94022 ай бұрын

    Okay, but why?

  • @muhendisim
    @muhendisim2 ай бұрын

    I'll not use but still it's interesting.

  • @SabarMohamed
    @SabarMohamed2 ай бұрын

    Full stack css dev 😂

  • @turbdonkey
    @turbdonkey2 ай бұрын

    I don't see the point. I would have to learn a new way to write code which doesn't have any benefits that I can tell.

  • @arthur_snow
    @arthur_snow2 ай бұрын

    thats cool, i guess

  • @rumble1925
    @rumble19252 ай бұрын

    Nope still is a bad idea. The biggest problem with styled components (besides CSS in JS) is naming and having a bunch of extra wrapper components. I don't see how this approach avoids this. CSS is good. Actually it's great, especially in 2024.

  • @idanmasas
    @idanmasas2 ай бұрын

    Why tho

  • @salihyil2
    @salihyil22 ай бұрын

  • @kelvinsmith4894
    @kelvinsmith48942 ай бұрын

    Honestly I don't like it

  • @TooCoolForBZ
    @TooCoolForBZ2 ай бұрын

    The css and js has gone out of hands lmao what is this. cute idea tho

  • @devdhaif
    @devdhaif2 ай бұрын

    You guys can't be serious, right ?

  • @edhahaz
    @edhahaz2 ай бұрын

    "use server"

  • @zalaam_0
    @zalaam_02 ай бұрын

    I hate writing designing and it is nightmare for me

  • @seroltech118
    @seroltech1182 ай бұрын

    honestly this should stop. Everyday we have a new lib/framework that solves a "problem" that doesn't exists, and then a new lib/framework will come up to solve a problem of the previous lib. And it's the same pattern over and over. If you think that import a css file is tiring : Stop coding

  • @shazam314

    @shazam314

    2 ай бұрын

    We have to create problems for job security.

  • @cannotthinkofanybetterhandle
    @cannotthinkofanybetterhandle2 ай бұрын

    Why tho? 😂

  • @senshawb
    @senshawb2 ай бұрын

    This is Banana😂

  • @ant.nguyen1994
    @ant.nguyen19942 ай бұрын

    biggest NOPE ever

  • @asadsalehumar1011
    @asadsalehumar10112 ай бұрын

    I don't think it has any usecases other than being funny

  • @anasouardini
    @anasouardini2 ай бұрын

    I can only imagine how ugly CSS files can get! LOL

  • @beta82
    @beta822 ай бұрын

    why tho 😂

  • @ibrahimmohammed3484
    @ibrahimmohammed34842 ай бұрын

    i like it, simple and easy to build UI library with

  • @eliav3
    @eliav32 ай бұрын

    Dislike. Don't begin with click baits This is not a new way writing your react components. Just yet another css framework

  • @snerketryne
    @snerketryne2 ай бұрын

    Haha react is a trainwreck

  • @kazmi401
    @kazmi4012 ай бұрын

    Honestly. It's just bullshit. I am Never gonna use it in my life.

  • @yassinesafraoui
    @yassinesafraoui2 ай бұрын

    🤨🤨🤨

  • @matteokinkela
    @matteokinkela2 ай бұрын

    Hell no!

  • @froxx93
    @froxx932 ай бұрын

    Thanks, I hate it! :)

  • @Zagoorland
    @Zagoorland2 ай бұрын

    Thanks, I hate it

  • @MrAlao675
    @MrAlao6752 ай бұрын

    These solutions here and there aren't good for beginners.

  • @lycan2494
    @lycan24942 ай бұрын

    at this point ur just making gimmick videos. its ridiculous

  • @gubatenkov
    @gubatenkov2 ай бұрын

    weired stuff

  • @Anacmb
    @Anacmb2 ай бұрын

    Just no.

  • @WingStopUS
    @WingStopUS2 ай бұрын

    😂😂😂 WTF

  • @Michael-Martell
    @Michael-Martell2 ай бұрын

    Nope nope nope nope nope nope

  • @abdarker1043
    @abdarker10432 ай бұрын

    well i don't like it

  • @HardGas911
    @HardGas9112 ай бұрын

    This is a terrible idea

  • @robertm4934
    @robertm49342 ай бұрын

    Okay.. this is outright stupid

  • @theSuitCat
    @theSuitCat2 ай бұрын

    A very nice useless framework

  • 2 ай бұрын

    I hate this.

  • @2gbeh
    @2gbehАй бұрын

    😵‍💫 absolutely useless

  • @jeremydudet
    @jeremydudet7 күн бұрын

    this sounds dumb

  • @knoraziel
    @knoraziel2 ай бұрын

    🤮

Келесі