[{"data":1,"prerenderedAt":1346},["ShallowReactive",2],{"guide-pascalcase-vs-camelcase":3},{"id":4,"title":5,"body":6,"date":1338,"description":1339,"extension":1340,"meta":1341,"navigation":195,"path":1342,"readingTime":282,"seo":1343,"stem":1344,"__hash__":1345},"guides\u002Fguides\u002Fpascalcase-vs-camelcase.md","PascalCase vs camelCase: When to Use Each Convention",{"type":7,"value":8,"toc":1310},"minimark",[9,14,18,75,84,88,93,96,151,155,158,218,229,233,328,332,388,392,446,450,454,509,513,574,578,642,646,690,694,867,876,880,884,887,904,908,911,945,949,987,991,1004,1045,1049,1052,1129,1132,1136,1228,1232,1269,1273,1294,1298,1306],[10,11,13],"h2",{"id":12},"the-two-most-common-naming-conventions","The Two Most Common Naming Conventions",[15,16,17],"p",{},"PascalCase and camelCase are the two dominant naming conventions in modern programming. They differ by one character: whether the first letter is uppercase or lowercase.",[19,20,21,37],"table",{},[22,23,24],"thead",{},[25,26,27,31,34],"tr",{},[28,29,30],"th",{},"Convention",[28,32,33],{},"Pattern",[28,35,36],{},"Example",[38,39,40,59],"tbody",{},[25,41,42,46,49],{},[43,44,45],"td",{},"PascalCase",[43,47,48],{},"First letter of every word uppercase",[43,50,51,55,56],{},[52,53,54],"code",{},"UserProfile",", ",[52,57,58],{},"JsonFormatter",[25,60,61,64,67],{},[43,62,63],{},"camelCase",[43,65,66],{},"First word lowercase, rest uppercase",[43,68,69,55,72],{},[52,70,71],{},"userProfile",[52,73,74],{},"jsonFormatter",[15,76,77,78,80,81,83],{},"Choosing the right convention isn't arbitrary — it communicates what a name represents. When you see ",[52,79,54],{},", you expect a class or component. When you see ",[52,82,71],{},", you expect a variable or function. This shared understanding makes code faster to read and easier to maintain.",[10,85,87],{"id":86},"when-to-use-pascalcase","When to Use PascalCase",[89,90,92],"h3",{"id":91},"classes-and-constructors","Classes and Constructors",[15,94,95],{},"In most object-oriented languages, PascalCase signals that a name is a class or constructor function:",[97,98,103],"pre",{"className":99,"code":100,"language":101,"meta":102,"style":102},"language-javascript shiki shiki-themes github-light github-dark","class UserProfile { }\nclass JsonFormatter { }\nconst ErrorBoundary = defineComponent({ })\n","javascript","",[52,104,105,122,132],{"__ignoreMap":102},[106,107,110,114,118],"span",{"class":108,"line":109},"line",1,[106,111,113],{"class":112},"szBVR","class",[106,115,117],{"class":116},"sScJk"," UserProfile",[106,119,121],{"class":120},"sVt8B"," { }\n",[106,123,125,127,130],{"class":108,"line":124},2,[106,126,113],{"class":112},[106,128,129],{"class":116}," JsonFormatter",[106,131,121],{"class":120},[106,133,135,138,142,145,148],{"class":108,"line":134},3,[106,136,137],{"class":112},"const",[106,139,141],{"class":140},"sj4cs"," ErrorBoundary",[106,143,144],{"class":112}," =",[106,146,147],{"class":116}," defineComponent",[106,149,150],{"class":120},"({ })\n",[89,152,154],{"id":153},"react-and-vue-components","React and Vue Components",[15,156,157],{},"Both React and Vue use PascalCase for component names:",[97,159,163],{"className":160,"code":161,"language":162,"meta":102,"style":102},"language-jsx shiki shiki-themes github-light github-dark","\u002F\u002F React\n\u003CUserProfile name=\"Alice\" \u002F>\n\n\u002F\u002F Vue template\n\u003CUserProfile name=\"Alice\" \u002F>\n","jsx",[52,164,165,171,191,197,203],{"__ignoreMap":102},[106,166,167],{"class":108,"line":109},[106,168,170],{"class":169},"sJ8bj","\u002F\u002F React\n",[106,172,173,176,178,181,184,188],{"class":108,"line":124},[106,174,175],{"class":120},"\u003C",[106,177,54],{"class":140},[106,179,180],{"class":116}," name",[106,182,183],{"class":112},"=",[106,185,187],{"class":186},"sZZnC","\"Alice\"",[106,189,190],{"class":120}," \u002F>\n",[106,192,193],{"class":108,"line":134},[106,194,196],{"emptyLinePlaceholder":195},true,"\n",[106,198,200],{"class":108,"line":199},4,[106,201,202],{"class":169},"\u002F\u002F Vue template\n",[106,204,206,208,210,212,214,216],{"class":108,"line":205},5,[106,207,175],{"class":120},[106,209,54],{"class":140},[106,211,180],{"class":116},[106,213,183],{"class":112},[106,215,187],{"class":186},[106,217,190],{"class":120},[15,219,220,221,224,225,228],{},"PascalCase distinguishes components from HTML elements. ",[52,222,223],{},"\u003CuserProfile>"," looks like a custom element; ",[52,226,227],{},"\u003CUserProfile>"," clearly signals a component.",[89,230,232],{"id":231},"typescript-types-and-interfaces","TypeScript Types and Interfaces",[97,234,238],{"className":235,"code":236,"language":237,"meta":102,"style":102},"language-typescript shiki shiki-themes github-light github-dark","interface UserProfile {\n  firstName: string\n  lastName: string\n}\n\ntype ApiResponse\u003CT> = {\n  data: T\n  status: number\n}\n","typescript",[52,239,240,250,262,271,276,280,301,312,323],{"__ignoreMap":102},[106,241,242,245,247],{"class":108,"line":109},[106,243,244],{"class":112},"interface",[106,246,117],{"class":116},[106,248,249],{"class":120}," {\n",[106,251,252,256,259],{"class":108,"line":124},[106,253,255],{"class":254},"s4XuR","  firstName",[106,257,258],{"class":112},":",[106,260,261],{"class":140}," string\n",[106,263,264,267,269],{"class":108,"line":134},[106,265,266],{"class":254},"  lastName",[106,268,258],{"class":112},[106,270,261],{"class":140},[106,272,273],{"class":108,"line":199},[106,274,275],{"class":120},"}\n",[106,277,278],{"class":108,"line":205},[106,279,196],{"emptyLinePlaceholder":195},[106,281,283,286,289,291,294,297,299],{"class":108,"line":282},6,[106,284,285],{"class":112},"type",[106,287,288],{"class":116}," ApiResponse",[106,290,175],{"class":120},[106,292,293],{"class":116},"T",[106,295,296],{"class":120},"> ",[106,298,183],{"class":112},[106,300,249],{"class":120},[106,302,304,307,309],{"class":108,"line":303},7,[106,305,306],{"class":254},"  data",[106,308,258],{"class":112},[106,310,311],{"class":116}," T\n",[106,313,315,318,320],{"class":108,"line":314},8,[106,316,317],{"class":254},"  status",[106,319,258],{"class":112},[106,321,322],{"class":140}," number\n",[106,324,326],{"class":108,"line":325},9,[106,327,275],{"class":120},[89,329,331],{"id":330},"enums","Enums",[97,333,335],{"className":235,"code":334,"language":237,"meta":102,"style":102},"enum HttpStatus {\n  Ok = 200,\n  NotFound = 404,\n  InternalServerError = 500,\n}\n",[52,336,337,347,360,372,384],{"__ignoreMap":102},[106,338,339,342,345],{"class":108,"line":109},[106,340,341],{"class":112},"enum",[106,343,344],{"class":116}," HttpStatus",[106,346,249],{"class":120},[106,348,349,352,354,357],{"class":108,"line":124},[106,350,351],{"class":140},"  Ok",[106,353,144],{"class":112},[106,355,356],{"class":140}," 200",[106,358,359],{"class":120},",\n",[106,361,362,365,367,370],{"class":108,"line":134},[106,363,364],{"class":140},"  NotFound",[106,366,144],{"class":112},[106,368,369],{"class":140}," 404",[106,371,359],{"class":120},[106,373,374,377,379,382],{"class":108,"line":199},[106,375,376],{"class":140},"  InternalServerError",[106,378,144],{"class":112},[106,380,381],{"class":140}," 500",[106,383,359],{"class":120},[106,385,386],{"class":108,"line":205},[106,387,275],{"class":120},[89,389,391],{"id":390},"namespace-like-exports","Namespace-like Exports",[97,393,395],{"className":99,"code":394,"language":101,"meta":102,"style":102},"export const ApiClient = {\n  get(url) { },\n  post(url, data) { },\n}\n",[52,396,397,412,426,442],{"__ignoreMap":102},[106,398,399,402,405,408,410],{"class":108,"line":109},[106,400,401],{"class":112},"export",[106,403,404],{"class":112}," const",[106,406,407],{"class":140}," ApiClient",[106,409,144],{"class":112},[106,411,249],{"class":120},[106,413,414,417,420,423],{"class":108,"line":124},[106,415,416],{"class":116},"  get",[106,418,419],{"class":120},"(",[106,421,422],{"class":254},"url",[106,424,425],{"class":120},") { },\n",[106,427,428,431,433,435,437,440],{"class":108,"line":134},[106,429,430],{"class":116},"  post",[106,432,419],{"class":120},[106,434,422],{"class":254},[106,436,55],{"class":120},[106,438,439],{"class":254},"data",[106,441,425],{"class":120},[106,443,444],{"class":108,"line":199},[106,445,275],{"class":120},[10,447,449],{"id":448},"when-to-use-camelcase","When to Use camelCase",[89,451,453],{"id":452},"variables-and-properties","Variables and Properties",[97,455,457],{"className":99,"code":456,"language":101,"meta":102,"style":102},"const firstName = 'Alice'\nconst isActive = true\nconst httpStatus = 200\n\nuser.firstName\nconfig.maxRetries\n",[52,458,459,471,483,495,499,504],{"__ignoreMap":102},[106,460,461,463,466,468],{"class":108,"line":109},[106,462,137],{"class":112},[106,464,465],{"class":140}," firstName",[106,467,144],{"class":112},[106,469,470],{"class":186}," 'Alice'\n",[106,472,473,475,478,480],{"class":108,"line":124},[106,474,137],{"class":112},[106,476,477],{"class":140}," isActive",[106,479,144],{"class":112},[106,481,482],{"class":140}," true\n",[106,484,485,487,490,492],{"class":108,"line":134},[106,486,137],{"class":112},[106,488,489],{"class":140}," httpStatus",[106,491,144],{"class":112},[106,493,494],{"class":140}," 200\n",[106,496,497],{"class":108,"line":199},[106,498,196],{"emptyLinePlaceholder":195},[106,500,501],{"class":108,"line":205},[106,502,503],{"class":120},"user.firstName\n",[106,505,506],{"class":108,"line":282},[106,507,508],{"class":120},"config.maxRetries\n",[89,510,512],{"id":511},"functions-and-methods","Functions and Methods",[97,514,516],{"className":99,"code":515,"language":101,"meta":102,"style":102},"function formatDate(date) { }\nfunction calculateTotal(items) { }\n\nobj.getItems()\narr.reduce(callback)\n",[52,517,518,534,548,552,563],{"__ignoreMap":102},[106,519,520,523,526,528,531],{"class":108,"line":109},[106,521,522],{"class":112},"function",[106,524,525],{"class":116}," formatDate",[106,527,419],{"class":120},[106,529,530],{"class":254},"date",[106,532,533],{"class":120},") { }\n",[106,535,536,538,541,543,546],{"class":108,"line":124},[106,537,522],{"class":112},[106,539,540],{"class":116}," calculateTotal",[106,542,419],{"class":120},[106,544,545],{"class":254},"items",[106,547,533],{"class":120},[106,549,550],{"class":108,"line":134},[106,551,196],{"emptyLinePlaceholder":195},[106,553,554,557,560],{"class":108,"line":199},[106,555,556],{"class":120},"obj.",[106,558,559],{"class":116},"getItems",[106,561,562],{"class":120},"()\n",[106,564,565,568,571],{"class":108,"line":205},[106,566,567],{"class":120},"arr.",[106,569,570],{"class":116},"reduce",[106,572,573],{"class":120},"(callback)\n",[89,575,577],{"id":576},"react-hooks","React Hooks",[97,579,581],{"className":99,"code":580,"language":101,"meta":102,"style":102},"const [count, setCount] = useState(0)\nconst user = useCurrentUser()\nconst router = useRouter()\n",[52,582,583,614,628],{"__ignoreMap":102},[106,584,585,587,590,593,595,598,601,603,606,608,611],{"class":108,"line":109},[106,586,137],{"class":112},[106,588,589],{"class":120}," [",[106,591,592],{"class":140},"count",[106,594,55],{"class":120},[106,596,597],{"class":140},"setCount",[106,599,600],{"class":120},"] ",[106,602,183],{"class":112},[106,604,605],{"class":116}," useState",[106,607,419],{"class":120},[106,609,610],{"class":140},"0",[106,612,613],{"class":120},")\n",[106,615,616,618,621,623,626],{"class":108,"line":124},[106,617,137],{"class":112},[106,619,620],{"class":140}," user",[106,622,144],{"class":112},[106,624,625],{"class":116}," useCurrentUser",[106,627,562],{"class":120},[106,629,630,632,635,637,640],{"class":108,"line":134},[106,631,137],{"class":112},[106,633,634],{"class":140}," router",[106,636,144],{"class":112},[106,638,639],{"class":116}," useRouter",[106,641,562],{"class":120},[89,643,645],{"id":644},"vue-composables","Vue Composables",[97,647,649],{"className":99,"code":648,"language":101,"meta":102,"style":102},"const { x, y } = useMouse()\nconst isDark = useDark()\n",[52,650,651,676],{"__ignoreMap":102},[106,652,653,655,658,661,663,666,669,671,674],{"class":108,"line":109},[106,654,137],{"class":112},[106,656,657],{"class":120}," { ",[106,659,660],{"class":140},"x",[106,662,55],{"class":120},[106,664,665],{"class":140},"y",[106,667,668],{"class":120}," } ",[106,670,183],{"class":112},[106,672,673],{"class":116}," useMouse",[106,675,562],{"class":120},[106,677,678,680,683,685,688],{"class":108,"line":124},[106,679,137],{"class":112},[106,681,682],{"class":140}," isDark",[106,684,144],{"class":112},[106,686,687],{"class":116}," useDark",[106,689,562],{"class":120},[10,691,693],{"id":692},"language-by-language-reference","Language-by-Language Reference",[19,695,696,715],{},[22,697,698],{},[25,699,700,703,706,709,712],{},[28,701,702],{},"Language",[28,704,705],{},"Classes\u002FTypes",[28,707,708],{},"Functions",[28,710,711],{},"Variables",[28,713,714],{},"Constants",[38,716,717,739,760,782,803,824,846],{},[25,718,719,722,726,730,734],{},[43,720,721],{},"JavaScript",[43,723,724],{},[52,725,45],{},[43,727,728],{},[52,729,63],{},[43,731,732],{},[52,733,63],{},[43,735,736],{},[52,737,738],{},"SCREAMING_SNAKE",[25,740,741,744,748,752,756],{},[43,742,743],{},"TypeScript",[43,745,746],{},[52,747,45],{},[43,749,750],{},[52,751,63],{},[43,753,754],{},[52,755,63],{},[43,757,758],{},[52,759,738],{},[25,761,762,765,769,774,778],{},[43,763,764],{},"Python",[43,766,767],{},[52,768,45],{},[43,770,771],{},[52,772,773],{},"snake_case",[43,775,776],{},[52,777,773],{},[43,779,780],{},[52,781,738],{},[25,783,784,787,791,795,799],{},[43,785,786],{},"Java",[43,788,789],{},[52,790,45],{},[43,792,793],{},[52,794,63],{},[43,796,797],{},[52,798,63],{},[43,800,801],{},[52,802,738],{},[25,804,805,808,812,816,820],{},[43,806,807],{},"C#",[43,809,810],{},[52,811,45],{},[43,813,814],{},[52,815,45],{},[43,817,818],{},[52,819,63],{},[43,821,822],{},[52,823,45],{},[25,825,826,829,834,838,842],{},[43,827,828],{},"Go",[43,830,831,833],{},[52,832,45],{},"*",[43,835,836],{},[52,837,63],{},[43,839,840],{},[52,841,63],{},[43,843,844],{},[52,845,45],{},[25,847,848,851,855,859,863],{},[43,849,850],{},"Rust",[43,852,853],{},[52,854,45],{},[43,856,857],{},[52,858,773],{},[43,860,861],{},[52,862,773],{},[43,864,865],{},[52,866,738],{},[15,868,869,870,872,873,875],{},"* In Go, ",[52,871,45],{}," names are exported (public); ",[52,874,63],{}," names are unexported (private).",[10,877,879],{"id":878},"edge-cases-and-conflicts","Edge Cases and Conflicts",[89,881,883],{"id":882},"react组件-vs-html元素","React组件 vs. HTML元素",[15,885,886],{},"Avoid component names that clash with HTML elements:",[97,888,892],{"className":889,"code":890,"language":891,"meta":102,"style":102},"language-diff shiki shiki-themes github-light github-dark","- \u003CSection \u002F>  \u002F\u002F ambiguous with \u003Csection>\n+ \u003CPageSection \u002F>\n","diff",[52,893,894,899],{"__ignoreMap":102},[106,895,896],{"class":108,"line":109},[106,897,898],{},"- \u003CSection \u002F>  \u002F\u002F ambiguous with \u003Csection>\n",[106,900,901],{"class":108,"line":124},[106,902,903],{},"+ \u003CPageSection \u002F>\n",[89,905,907],{"id":906},"abbreviations-in-pascalcase","Abbreviations in PascalCase",[15,909,910],{},"Treat abbreviations as words:",[97,912,914],{"className":889,"code":913,"language":891,"meta":102,"style":102},"- XMLParser    \u002F\u002F reads as X-M-L-Parser\n+ XmlParser    \u002F\u002F reads as Xml-Parser\n\n- getUserIdHTTP   \u002F\u002F jarring transition\n- getUserIdHttp   \u002F\u002F better\n+ fetchUserIdHttp \u002F\u002F clearer intent\n",[52,915,916,921,926,930,935,940],{"__ignoreMap":102},[106,917,918],{"class":108,"line":109},[106,919,920],{},"- XMLParser    \u002F\u002F reads as X-M-L-Parser\n",[106,922,923],{"class":108,"line":124},[106,924,925],{},"+ XmlParser    \u002F\u002F reads as Xml-Parser\n",[106,927,928],{"class":108,"line":134},[106,929,196],{"emptyLinePlaceholder":195},[106,931,932],{"class":108,"line":199},[106,933,934],{},"- getUserIdHTTP   \u002F\u002F jarring transition\n",[106,936,937],{"class":108,"line":205},[106,938,939],{},"- getUserIdHttp   \u002F\u002F better\n",[106,941,942],{"class":108,"line":282},[106,943,944],{},"+ fetchUserIdHttp \u002F\u002F clearer intent\n",[89,946,948],{"id":947},"two-letter-abbreviations-stay-uppercase","Two-letter abbreviations stay uppercase:",[97,950,952],{"className":99,"code":951,"language":101,"meta":102,"style":102},"const id = 42          \u002F\u002F not iD\nconst ui = getUI()      \u002F\u002F not getUi()\n",[52,953,954,969],{"__ignoreMap":102},[106,955,956,958,961,963,966],{"class":108,"line":109},[106,957,137],{"class":112},[106,959,960],{"class":140}," id",[106,962,144],{"class":112},[106,964,965],{"class":140}," 42",[106,967,968],{"class":169},"          \u002F\u002F not iD\n",[106,970,971,973,976,978,981,984],{"class":108,"line":124},[106,972,137],{"class":112},[106,974,975],{"class":140}," ui",[106,977,144],{"class":112},[106,979,980],{"class":116}," getUI",[106,982,983],{"class":120},"()      ",[106,985,986],{"class":169},"\u002F\u002F not getUi()\n",[89,988,990],{"id":989},"boolean-naming","Boolean naming",[15,992,993,994,55,997,1000,1001,258],{},"Prefix boolean variables and methods with ",[52,995,996],{},"is",[52,998,999],{},"has",", or ",[52,1002,1003],{},"should",[97,1005,1007],{"className":99,"code":1006,"language":101,"meta":102,"style":102},"const isActive = true\nconst hasPermission = checkPermission()\nconst shouldRetry = error.isTransient\n",[52,1008,1009,1019,1033],{"__ignoreMap":102},[106,1010,1011,1013,1015,1017],{"class":108,"line":109},[106,1012,137],{"class":112},[106,1014,477],{"class":140},[106,1016,144],{"class":112},[106,1018,482],{"class":140},[106,1020,1021,1023,1026,1028,1031],{"class":108,"line":124},[106,1022,137],{"class":112},[106,1024,1025],{"class":140}," hasPermission",[106,1027,144],{"class":112},[106,1029,1030],{"class":116}," checkPermission",[106,1032,562],{"class":120},[106,1034,1035,1037,1040,1042],{"class":108,"line":134},[106,1036,137],{"class":112},[106,1038,1039],{"class":140}," shouldRetry",[106,1041,144],{"class":112},[106,1043,1044],{"class":120}," error.isTransient\n",[10,1046,1048],{"id":1047},"file-naming-conventions","File Naming Conventions",[15,1050,1051],{},"The relationship between file names and the convention of their exports varies by framework:",[19,1053,1054,1067],{},[22,1055,1056],{},[25,1057,1058,1061,1064],{},[28,1059,1060],{},"Framework",[28,1062,1063],{},"Component File",[28,1065,1066],{},"Utility File",[38,1068,1069,1084,1099,1114],{},[25,1070,1071,1074,1079],{},[43,1072,1073],{},"React",[43,1075,1076],{},[52,1077,1078],{},"UserProfile.tsx",[43,1080,1081],{},[52,1082,1083],{},"formatDate.ts",[25,1085,1086,1089,1094],{},[43,1087,1088],{},"Vue",[43,1090,1091],{},[52,1092,1093],{},"UserProfile.vue",[43,1095,1096],{},[52,1097,1098],{},"useMouse.ts",[25,1100,1101,1104,1109],{},[43,1102,1103],{},"Next.js",[43,1105,1106],{},[52,1107,1108],{},"user-profile.tsx",[43,1110,1111],{},[52,1112,1113],{},"format-date.ts",[25,1115,1116,1119,1124],{},[43,1117,1118],{},"Angular",[43,1120,1121],{},[52,1122,1123],{},"user-profile.component.ts",[43,1125,1126],{},[52,1127,1128],{},"format-date.service.ts",[15,1130,1131],{},"Vue and React both use PascalCase for component files. Some frameworks (Next.js App Router, SvelteKit) use kebab-case for file names regardless of what the export uses.",[10,1133,1135],{"id":1134},"common-mistakes","Common Mistakes",[19,1137,1138,1150],{},[22,1139,1140],{},[25,1141,1142,1145,1147],{},[28,1143,1144],{},"Mistake",[28,1146,36],{},[28,1148,1149],{},"Fix",[38,1151,1152,1166,1181,1198,1213],{},[25,1153,1154,1157,1162],{},[43,1155,1156],{},"camelCase for components",[43,1158,1159],{},[52,1160,1161],{},"userProfile.vue",[43,1163,1164],{},[52,1165,1093],{},[25,1167,1168,1171,1176],{},[43,1169,1170],{},"PascalCase for hooks",[43,1172,1173],{},[52,1174,1175],{},"UseAuth()",[43,1177,1178],{},[52,1179,1180],{},"useAuth()",[25,1182,1183,1186,1195],{},[43,1184,1185],{},"Inconsistent abbreviations",[43,1187,1188,1191,1192],{},[52,1189,1190],{},"getHtml"," \u002F ",[52,1193,1194],{},"getHTML",[43,1196,1197],{},"Pick one style, stick with it",[25,1199,1200,1203,1208],{},[43,1201,1202],{},"camelCase for types",[43,1204,1205],{},[52,1206,1207],{},"apiResponse",[43,1209,1210],{},[52,1211,1212],{},"ApiResponse",[25,1214,1215,1218,1223],{},[43,1216,1217],{},"PascalCase for variables",[43,1219,1220],{},[52,1221,1222],{},"const UserName = 'Alice'",[43,1224,1225],{},[52,1226,1227],{},"const userName = 'Alice'",[10,1229,1231],{"id":1230},"key-takeaways","Key Takeaways",[1233,1234,1235,1239,1242,1245,1248,1266],"ul",{},[1236,1237,1238],"li",{},"PascalCase signals types, classes, and components — things you instantiate or reference as blueprints",[1236,1240,1241],{},"camelCase signals variables, functions, and properties — things that hold values or perform actions",[1236,1243,1244],{},"Both React and Vue use PascalCase for component names in templates",[1236,1246,1247],{},"TypeScript uses PascalCase for interfaces, types, and enums",[1236,1249,1250,1251,1254,1255,1258,1259,55,1262,1265],{},"Treat abbreviations as words (",[52,1252,1253],{},"XmlParser",", not ",[52,1256,1257],{},"XMLParser","), except two-letter ones (",[52,1260,1261],{},"id",[52,1263,1264],{},"ui",")",[1236,1267,1268],{},"Match your file naming convention to your framework's convention, not your personal preference",[10,1270,1272],{"id":1271},"related-guides","Related Guides",[1233,1274,1275,1282,1288],{},[1236,1276,1277],{},[1278,1279,1281],"a",{"href":1280},"\u002Fguides\u002Fnaming-conventions-guide","Naming Conventions Guide",[1236,1283,1284],{},[1278,1285,1287],{"href":1286},"\u002Fguides\u002Fcamelcase-vs-snake-case","camelCase vs snake_case",[1236,1289,1290],{},[1278,1291,1293],{"href":1292},"\u002Fguides\u002Fcode-readability-tips","Code Readability Tips",[10,1295,1297],{"id":1296},"try-it-yourself","Try It Yourself",[15,1299,1300,1301,1305],{},"Convert text between PascalCase, camelCase, snake_case, and more with our free ",[1278,1302,1304],{"href":1303},"\u002Ftools\u002Fcase-converter","Case Converter",". Paste any text and get instant conversions across all common naming conventions.",[1307,1308,1309],"style",{},"html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sJ8bj, html code.shiki .sJ8bj{--shiki-default:#6A737D;--shiki-dark:#6A737D}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .s4XuR, html code.shiki .s4XuR{--shiki-default:#E36209;--shiki-dark:#FFAB70}",{"title":102,"searchDepth":124,"depth":124,"links":1311},[1312,1313,1320,1326,1327,1333,1334,1335,1336,1337],{"id":12,"depth":124,"text":13},{"id":86,"depth":124,"text":87,"children":1314},[1315,1316,1317,1318,1319],{"id":91,"depth":134,"text":92},{"id":153,"depth":134,"text":154},{"id":231,"depth":134,"text":232},{"id":330,"depth":134,"text":331},{"id":390,"depth":134,"text":391},{"id":448,"depth":124,"text":449,"children":1321},[1322,1323,1324,1325],{"id":452,"depth":134,"text":453},{"id":511,"depth":134,"text":512},{"id":576,"depth":134,"text":577},{"id":644,"depth":134,"text":645},{"id":692,"depth":124,"text":693},{"id":878,"depth":124,"text":879,"children":1328},[1329,1330,1331,1332],{"id":882,"depth":134,"text":883},{"id":906,"depth":134,"text":907},{"id":947,"depth":134,"text":948},{"id":989,"depth":134,"text":990},{"id":1047,"depth":124,"text":1048},{"id":1134,"depth":124,"text":1135},{"id":1230,"depth":124,"text":1231},{"id":1271,"depth":124,"text":1272},{"id":1296,"depth":124,"text":1297},"2026-05-28","Understand when to use PascalCase vs camelCase — naming conventions for classes, components, variables, and constants across programming languages.","md",{"immutable":195},"\u002Fguides\u002Fpascalcase-vs-camelcase",{"title":5,"description":1339},"guides\u002Fpascalcase-vs-camelcase","nC-FHqDMecpEqgm2jUrl28imf4DHjV-PR6IX_OiHyFo",1780401335634]