You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Translate and refine content in thinking-in-react.md
Updated the content to reflect a more concise explanation of programming, CSS, and design principles in the context of React components, translating from English to Bengali.
Copy file name to clipboardExpand all lines: src/content/learn/thinking-in-react.md
-13Lines changed: 0 additions & 13 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -37,15 +37,9 @@ React এ একটি UI ইমপ্লিমেন্ট করতে আপ
37
37
38
38
একটি ডিজাইনের কম্পোনেন্ট গুলোকে আপনি বিভিন্ন ভাবে ভাগ করতে পারেন। কীভাবে করবেন সেটা নির্ভর করবে আপনার কাজের ক্ষেত্রের উপর।
39
39
40
-
<<<<<<< HEAD
41
40
***Programming**--একটি নতুন function বা object তৈরী করবেন কি না এই সিদ্ধান্তটি যেভাবে নিতেন, ঠিক একই পদ্ধতিতে সিদ্ধান্ত নিন। এমন একটি পদ্ধতি হচ্ছে [separation of concerns](https://en.wikipedia.org/wiki/Separation_of_concerns), যা অনুসারে, একটা কম্পোনেন্ট আদর্শত কেবল একটি কাজই করবে। যদি সেটা বড় হয়ে যায় তাহলে ছোট ছোট সাবকম্পোনেন্ট এ ভাগ করে ফেলতে হবে।
42
41
***CSS**--আপনি class selector কীসের জন্য তৈরী করতেন সেটা বিবেচনায় রাখুন (যদিও কম্পোনেন্ট আরেকটু কম granular)।
43
42
***Design**--চিন্তা করুন আপনি আপনার ডিজাইনের layer গুলো কীভাবে বিন্যস্ত করতেন।
44
-
=======
45
-
***Programming**--use the same techniques for deciding if you should create a new function or object. One such technique is the [separation of concerns](https://en.wikipedia.org/wiki/Separation_of_concerns), that is, a component should ideally only be concerned with one thing. If it ends up growing, it should be decomposed into smaller subcomponents.
46
-
***CSS**--consider what you would make class selectors for. (However, components are a bit less granular.)
47
-
***Design**--consider how you would organize the design's layers.
48
-
>>>>>>> abe931a8cb3aee3e8b15ef7e187214789164162a
49
43
50
44
যদি আপনার JSON গোছানো থাকে, আপনি দেখবেন বেশির ভাগ সময় এটা স্বাভাবিকতই আপনার UI এর কম্পোনেন্ট এর গঠন বিন্যাসের সাথে মিলে যাবে। এর কারণ UI এবং ডেটা মডেলগুলো সাধারণত একই information architecture ব্যবহার করে, অর্থাৎ একই আকারে বিন্যস্ত হয়। আপনার UI কে এমন ভাবে কম্পোনেন্ট এ ভাগ করুন যেন প্রতিটি কম্পোনেন্ট আপনার ডেটা মডেলের একটি অংশের সাথে মিলে যায়।
51
45
@@ -234,17 +228,10 @@ UI interactive করার জন্য আপনাকে ব্যবহা
234
228
235
229
আমরা একে একে আরেকবার বুঝে নেইঃ
236
230
237
-
<<<<<<< HEAD
238
231
1. পণ্যের আসল তালিকা **props হিসেবে চলে আসে, সুতরাং এটা state না।**
239
232
2. খুঁজার জন্য ব্যবহারকারী যে ইনপুট দিবেন সেটা state হবার কথা, কারণ এটা সময়ের সাথে সাথে বদলে যাবে এবং কোন কিছু থেকে এটা compute করা সম্ভব না।
240
233
3. চেকবক্সের ভ্যালুটাও একটা state কারণ এটা সময়ের সাথে সাথে বদলাবে এবং কোনভাবে compute করা সম্ভব না।
241
234
4. পণ্য বাছাই করা তালিকাটি **state না** কারণ চেকবক্সের ভ্যালু এবং পণ্যের তালিকা থেকে সার্চ টেক্সট বাছাই করার মাধ্যমে তা **compute করা সম্ভব**।
242
-
=======
243
-
1. The original list of products is **passed in as props, so it's not state.**
244
-
2. The search text seems to be state since it changes over time and can't be computed from anything.
245
-
3. The value of the checkbox seems to be state since it changes over time and can't be computed from anything.
246
-
4. The filtered list of products **isn't state because it can be computed** by taking the original list of products and filtering it according to the search text and value of the checkbox.
247
-
>>>>>>> abe931a8cb3aee3e8b15ef7e187214789164162a
248
235
249
236
অর্থাৎ, শুধুমাত্র সার্চ টেক্সট এবং চেকবক্সের ভ্যালু এই দুইটাই state! কী সুন্দরমত হয়ে গেল!
0 commit comments