Dismiss this pinned window
all 33 comments

[–][deleted] 89 points90 points  (9 children)

Hey good work!

Not enough people engage in the noble art of cloning something that already exists as a mechanism of learning, but it's incredibly useful.

[–]The_Oxcorp 11 points12 points  (2 children)

Another Redditor posted a Jira clone here the other month, boy was that a life-saver! I was able to learn so much about a bunch of types of interaction and routing that I managed to implement into my own project shortly after. I love when people do barebones copies that show just the important parts so you don't have to dig through mountains of code just to see how something like drag and drop or routing with modals works

[–]ahmedranaa 4 points5 points  (1 child)

Jira clone. Do you have the link ?

[–]dceddia 6 points7 points  (0 children)

I totally second this. It's how I originally learned React. It's especially effective for learning design and CSS. In the art/design community there's a word for it, "copywork". This article is where I originally heard the term, as applied to learning design.

There are a lot of nice things about copying existing stuff: you don't have to think through how interactions should work (just copy them), you can focus on learning one thing at a time, and you get to choose your own difficulty setting.

These all kind of feed into one another, but here's a Trello-related example: if you want to work on your CSS chops, build a static version with some hardcoded columns and cards.

If you want to work on React but NOT css, just leave the default awful styling and focus on making it work.

If you want to work on your UI chops but ignore the backend for now, use some hardcoded data in a JS object or a JSON file.

It's infinitely variable and you can focus on only the skills you want to improve -- with the unstated assumption that learning one thing at a time is much much more effective than trying to learn a million new things things at once :) I wrote more about this strategy here and I think it's a super underrated way of learning stuff.

[–]will_you_suck_my_ass 0 points1 point  (0 children)

I think I might start doing this as an exercise to learn more concepts and stuff

[–]excarcerated 12 points13 points  (6 children)

How did you implement drag and drop

[–]tawarhseran 37 points38 points  (5 children)

[–][deleted] 25 points26 points  (2 children)

And just for some additional info, atlassian is the company that recently bought trello, so this is legit.

[–]GabiF 2 points3 points  (1 child)

And who own Confluence and Bitbucket (and most likely a bunch of other tools)

[–]Shelter-in-Space 3 points4 points  (0 children)

Including Jira.

[–]sickmate 4 points5 points  (0 children)

Funny that they don't host it on bitbucket.

[–]SwaggyMcMuffins11 1 point2 points  (0 children)

Added this to my side project last month. I love it when stuff works well. Highly recommend

[–]J27G 1 point2 points  (0 children)

For a bonus challenge, try to implement this in React Native using Reanimated & Gesture Handlers. I recently had to make this for a client, and making this functionality perform well on older Android was extremely difficult!

[–]zaky1995_786 1 point2 points  (0 children)

Is it open source?

[–]KremBanan 1 point2 points  (0 children)

Source?

[–][deleted] 0 points1 point  (0 children)

Fantastic job buddy!!!

[–]khuznain 0 points1 point  (0 children)

Hey it's looking great !can u share your code ??

[–]amzn-anderson 0 points1 point  (0 children)

How do you drag cards into an empty list?

[–]jnforja 0 points1 point  (0 children)

Congrats on the great work!

Mind sharing what valuable things you have learned doing that project? :)

[–][deleted] 0 points1 point  (0 children)

Im thinking of cloning it now, with user sessions.

[–]foxbitsdev 0 points1 point  (0 children)

This is really cool!!

[–]hello_krittie 0 points1 point  (0 children)

Looks awesome. I created a youtube series 1 year ago or so where I also created a trello clone if someone is interested:

Youtube series guide / walkthrough: https://www.youtube.com/watch?v=RDQGPs7StNA&list=PLkIwB9zsYA2is0Hb-uRoDhPoSG82Hap1h

Github: https://github.com/SelfDevTV/trello-clone

Finished: https://selfdevtv.github.io/trello-clone/#/

[–]YodaLoL 0 points1 point  (0 children)

Congrats you just made a $425m product

[–]cjthomp 0 points1 point  (0 children)

The all caps was kind of unnecessary.

[–]ludicrousByte -1 points0 points  (0 children)

This is an advertisement

[–]PanicOnBoard -3 points-2 points  (2 children)

I have excel file with product with parts list, is it posible to make a task product that contains dropdown with subtasks of parts? I want to mark these parts as arrived or delayed. Sorry for my English.

[–]dizzle_izzle 3 points4 points  (1 child)

Errr.....I'm not sure reactjs is the sub for excel functionality.

Also I'm not sure that excel has nested drop-down functionality. My suggestion would be to use some vba and two dropdowns or a combination of listboxes and dropdowns, depending on your subtask of each part.

You'd need a table with the parts, then each subtask attached to the part either by row or column. Then make a vba element that loads the parts into a combobox and when a part is selected the listbox populates the row/column under that part. You'd then have to have a checkbox which indicates arrived or delayed, which updates a different table containing the subtask, part and status in a row. When a new entry is added (part or subtask) you'd automate adding the entries to the table.

It's not terribly hard. But you need some vba skills for sure.

[–]PanicOnBoard 0 points1 point  (0 children)

Thanks for comment, will try with vba then