ChatGPTãšã¯ïŒ
OpenAIãéçºããGPT-3ãšããèšèªã¢ãã«ãããŒã¹ãšãã(å·çåœæ)ãã£ããã¢ããªã§ãã
ãã¡ãã®è³ªåã«å¯ŸããŠãAIãè²ã ãªè³ªåã«çããŠãããŠãäžè¬çãªå 容ã ãã§ã¯ãªããã³ãŒãã¬ãã¥ãŒããã°ãªã©ãçºèŠããŠããããã£ã¡ãåããã€ã§ãã
现ããå 容ã¯ä»¥äžã®èšäºããšãŠãåèãšãªããŸãã
çè ã®é¢é£èšäº
VSCodeãšé£æºããŠããã©ãŠã¶ãéããªããŠãChatGPTã䜿çšã§ããããã«ãã
éåžžã¯ãã©ãŠã¶ãéããŠäœ¿çšããã®ã§ãããã³ãŒãã£ã³ã°äžã«ãµã¯ããšã¬ãã¥ãŒããŠããã£ããããã°ãèŠã€ããŠãããããããªæ¡åŒµæ©èœããã£ãã®ã§ããã¡ãã®èšå®æ¹æ³ã«ã€ããŠèšè¿°ããŠã¿ãŸãã
- ä»åã€ã³ã¹ããŒã«ããæ¡åŒµæ©èœ
䜿çšãŸã§ã®æé
ç°å¢
- PC: MacBook Pro (Apple M2)
- OS: macOS Ventura 13.1
- VSCode: v1.74.3
OpenAIã®äŸ¡æ Œã«ã€ããŠ
â» 2023/1/17远èš(webgotoããæé£ãããããŸã)
ç»é²æã«$18åã®ã¯ã¬ãžãããä»äžãããŸãŸãããæå¹æéã¯3ã¶æéã§ãã
ãã以éã¯ææãšãªããŸãããã¯ã¬ãžããã«ãŒããç»é²ããªããŠã$18åã¯ä»äžãããã®ã§ãåæã«èª²éããããªã©ã¯ãªãããã§ãã
ç»é²åŸã®ç¶æ³ã¯ Personal > Manage account > Free trial usage ãã確èªã§ããŸãã
äŸ¡æ Œã«é¢ããŠã¯ãã¡ãã«èšèŒããããŸãã
OpenAIãžç»é²(ç¡ææ ãã)
- https://chat.openai.com/auth/login ãžã¢ã¯ã»ã¹
- ãLoginããã¯ãªãã¯
- ä»åã¯Googleã¢ã«ãŠã³ãã䜿ã£ãŠãã°ã€ã³ãããããContinue with Googleããã¯ãªãã¯ããŠãã°ã€ã³

- ã¢ã«ãŠã³ãç»é²ãçµãã£ããæ¬¡ã®æé ã§ã
æ¡åŒµæ©èœã®ã€ã³ã¹ããŒã«ããèšå®
2. æ¡åŒµæ©èœã®èšå®
-
æ¯è»ããŒã¯ãã¯ãªãã¯
-
Settings ãéãã®ã§ãChromiunm PathããšãApi Keyããèšå®

-
Chromiunm Path ã®èª¿ã¹æ¹(Mac)
-
Api Key ã®èšå®
-
Method é ç®ã®å€æŽ
-
æ¥æ¬èªã§åçããŠãããããã«ãã(2023/1/16远èš)
- èšå®ã«æ¥æ¬èªã®è³ªåæãå ¥ãããšæ¥æ¬èªã§è¿ä¿¡ããŠãããããã§ã(akiraakããæ å ±æäŸæé£ãããããŸã)
3. 䜿çšã§ããããã«ãªã£ãŠããã確èªãã
- é©åœã«ã³ãŒããç¯å²éžæããŠå³ã¯ãªãã¯ãããéã«ã以äžã®ãããªé
ç®ãåºãŠããã°OKã§ã
å®éã«äœ¿ã£ãŠã¿ã
ãã°ãçºèŠããŠããã
ä»åãæå³çã«ãã°ãä»èŸŒãã Fizz Buzzã³ãŒããäœã£ãŠã¿ãŸããã
ãã®ã³ãŒããéžæããŠå³ã¯ãªãã¯ãããChatGPT: Find bugsããã¯ãªãã¯ããŠã¿ãŸãã
ãããšä»¥äžã®ã¬ãã¥ãŒãåž°ã£ãŠããŸãã
ã³ãŒãã¯ã»ãšãã©åé¡ãªãããã«èŠããŸããã察åŠã§ããåé¡ãããã€ããããŸãã
æ¡ä»¶åå²ã®é åºããããŠããŸããæåã« if(i % 15 === 0) ã
次㫠if(i % 3 === 0)ãæåŸã« if(i % 5 === 0) ãšãã¹ãã ããã
Fizz Buzz ã«é¢ããŠã¯ãã®é çªãåªå
ãããããã ã
let i = 1 ã¯ãlet i = 0 ã«å€æŽãã¹ãã§ãã
ããã¯ãFizz Buzz ã®éå§çªå·ã ããã§ãã
console.logã¯ã1ã«ãŒãã«1åããå®è¡ãããªãã®ã§ã
ifæã®å€ã«çœ®ãã¹ãã§ããifæã®åŸã«ãconsole.log(output)ã®ããã«ããŸãã
outputã¯ãå€ã«å¿ããŠFizzãBuzzãFizz Buzzãä¿æãã倿°ã§ãã
if-elseæã®æåŸã«ã¯ã3,5,15ã§å²ãåããªãæ°ãæ±ãããã®
ããã©ã«ãã±ãŒã¹ã远å ããããšãã§ããŸãã
å
šäœãšããŠããã®ã³ãŒãã¯ãæ¡ä»¶æã®é åºã倿Žããi = 0 ãåæåãã
console.log æã if-else ã®å€ã«çœ®ãã
3, 5, 15 ã§å²ãåããªãå€ã«å¯ŸåŠããããã®ããã©ã«ãã±ãŒã¹ã
远å ããããšã§æ¹åããããšãã§ããŸãã
ã³ãŒããæé©å(ãªãã¡ã¯ã¿)ããŠããã
ç¶ããŠã¯ããChatGPT: Add Optimizeããã¯ãªãã¯ããŸãã
ãã®ã³ãŒãã¯ä»¥äžã®ããã«æé©åããããšãã§ããŸãã
for(let i = 0; i < 100; i++) {
output = ''
if(i % 3 === 0) output += 'Fizz'
if(i % 5 === 0) output += 'Buzz'
console.log(output || i)
}
ããã§ãifæ¡ä»¶ã®æ°ã4ã€ãã2ã€ã«æžããããå¹ççã«ãªããŸããã
ãã°ãçŽããç¶æ ã§ãªãã¡ã¯ã¿ãããŸããã
ãã¹ãã³ãŒããæããŠããã
ããã«ããChatGPT: Add testsããã¯ãªãã¯ããŠã¿ãŸãã
ãã¹ãã¯äžããããå
¥åã«å¯ŸããŠæåŸ
ãããåºåããã§ãã¯ãã¹ãã§ãã
ã§ããããåé¡ã®ã³ãŒãã§ã¯ãå
¥åãšããŠæ§ã
ãªæŽæ°ããã§ãã¯ãã
æ£ããåºåïŒFizz, Buzz, Fizz Buzz, ãããã¯æ°åãã®ãã®ïŒã
èšé²ããããã©ããã確èªãã¹ãã§ãã
è¯ãåºçºç¹ã¯æ¬¡ã®ãããªãã®ã§ãããã
test('Test FizzBuzz func.', () => {
// Check values divisible by 3 and 5
expect(fizzBuzz(15)).toBe('Fizz Buzz');
// Check values divisible by 3
expect(fizzBuzz(6)).toBe('Fizz');
// Check values divisible by 5
expect(fizzBuzz(10)).toBe('Buzz');
// Check values not divisible by 3 and 5
expect(fizzBuzz(7)).toBe(7);
});
ã³ãŒãã®è§£èª¬ãããŠããã
ç¶ããŠã¯ãææ¡ããããªãã¡ã¯ã¿ã³ãŒãã®ç¶æ ã§ãChatGPT: Explainããã¯ãªãã¯ããŠã¿ãŸãã
ãã®ã³ãŒãã¯ãå€å
žçãªFizzBuzzããã°ã©ã ãããå¹ççã«ãããã®ã§ããã
0 ãã 99 ãŸã§ãã«ãŒãããããããã®æ°ãã¢ãžã¥ãæŒç®å % ã§ãã§ãã¯ãã
å¿
èŠãªã "Fizz" ãš "Buzz" ã®å€ãäžã€ã®æååïŒåºåïŒã«é£çµãã
3ã§å²ãåããæ°ïŒi % 3 === 0 ã§è¡šç€ºïŒã«å¯ŸããŠã¯ "Fizz" ã
5ã§å²ãåããæ°ã«å¯ŸããŠã¯ "Buzz" ãåºåæååã« "Fizz" ãš "Buzz" ã
äž¡æ¹å«ãŸããŠããã° "Fizz Buzz" ã3 ãš 5 ã§å²ãåããªãæ°ã«å¯ŸããŠã¯
ãã®æ°å€èªäœãããªã³ãã¢ãŠãããŠåºåããŠããŸã
ãã®ä»ãChatGPTã®äŸ¿å©ãªäœ¿ãæ¹
ããããã¯ãhttps://chat.openai.com/chat ã§å ¥åããå¿ èŠããããŸãããããã€ãçè ã䟿å©ã ãªãšæã£ãå 容ãèšè¿°ããããŸãã
ã¡ãœããåãææ¡ããŠããã
ã¡ãœããåã®åœåã§è±èªã«è¿·ã£ãæã«ã以äžã®ããã«è³ªåãããšåè£ããããŠãããŸãã
ã<åŠçå 容>ãšããåŠçãè¡ãã¡ãœããåã®åè£ãããã€ãæããŠãã ããã
äŸïŒãã¡ã€ã«ã«åºåãšããåŠçãè¡ãã¡ãœããåã®åè£ãããã€ãæããŠãã ãã
äžèšã®ããã«å ¥åãããšä»¥äžã®ããã«åçããŠãããŸãã
ããã£ãœãè±èªãè¿ã£ãŠããŸãã
倿°åãææ¡ããŠããã
åãèŠé ã§å€æ°åãææ¡ããŠãããŸãã
ã<>ãšãã圹å²ã®å€æ°åã®åè£ãããã€ãæããŠãã ããã
äŸïŒåææžã¿ãšãã圹å²ã®å€æ°åã®åè£ãããã€ãæããŠãã ãã
ãããšä»¥äžã®ããã«è¿ã£ãŠããŸãã
ãããã¯ããæ¿èªæžã¿ããŸãã¯ãåææžã¿ãã®ç¶æ
ãäŒãã
倿°åã®ããã€ãã®äŸã§ãã
ããªããéžã¶æ£ç¢ºãªååã¯ãããªãã®ããã°ã©ã ã®æèãšã
ããªããåŸã£ãŠããåœåèŠåã«äŸåããŸãã
åãããããåœåã«ãªãããã«ããªãŒããã«ã³ãŒããèªãã ããcodicãåèã«ããŠã¿ãããèšäºãåèã«(ãã¡ãã®èšäºç)ãããŠããã£ãŠããŸããããè¿·ã£ãæã®åè£ãšããŠãã¡ããè¯ãããã«æããŸããã
(åœåã¯ãšãŠã倧äºã§ãã)
çè§£ã®ææ§ãªçšèªãèŠçŽããŠããã
ã<çšèª>ãèŠçŽããŠããšå ¥åããããšã§ãææ§ãªçšèªãèŠçŽããŠãããããšãã§ããŸãã
äŸïŒTDDãèŠçŽããŠ
äŸïŒDDDãèŠçŽããŠ
ãããããã®ã§ããã1ã€ã
äŸïŒClean ArchitectureãèŠçŽããŠ
ããŒããã
æžç±ãèªãåã«ãã£ãããšããæŠå¿µã ãé ã«çœ®ããŠããã«ã¯ãããããããŸãããã
ãã®ãããã¯ãã£ãããšæžç±ããã©ãŠã¶æ€çŽ¢ãªã©ã§ç¥èŠãæ·±ããŠã
ã¡ãããšçè§£ããå¿
èŠãããããã§ãã
çšèªã詳ãã解説ããŠããã
詊ãã«ããClean Architectureã詳ãã解説ããŠããããã¯ãClean Architectureã«ã€ããŠè©³ããæããŠããšå ¥åã
...éäžã§æ¢ãŸã£ãŠããŸããŸããã
â»2023/1/16远èš
éäžã§æ¢ãŸã£ãŠããŸã£ãå Žåã¯ããç¶ãããšå
¥åãããšéåããç®æããç¶ããŠãããŸãã(kazuphããæ
å ±æäŸæé£ãããããŸã)
ãµã³ãã«ã³ãŒããæããŠããã
ã<>ã®å®äŸã³ãŒããæããŠããããã¯ã<>ã®ãµã³ãã«ã³ãŒããæããŠããšå ¥åãããšæããŠãããŸã
éäžã§æ¢ãŸã£ãŠããŸãã®ã§ããç¶ãããšå ¥åããŸãã
äŸïŒãtypescriptã§ã®dddã®å®äŸã³ãŒãããæããŠ
DDD (Domain-Driven Design)ã¯ã¢ããªã±ãŒã·ã§ã³ã®èšè𿹿³è«ã§ãããç¹å®ã®ãã¡ã€ã³ã«ç¹åããèšèšãè¡ãããšãç®çãšããŠããŸãã
TypeScriptã§DDDãå®è£
ããããã®ã³ãŒãäŸã瀺ãããšã¯é£ãããããäžè¬çãªDDDã®ã¢ãããŒãã説æããŸãã
DDDã«ã¯ã以äžã®ãããª3ã€ã®ã¬ã€ã€ãŒããããŸãã
ãã¡ã€ã³å±€ïŒãã¡ã€ã³ã¢ãã«ãšãã¡ã€ã³ããžãã¯ãå«ãŸããŸããããã¯ãã¢ããªã±ãŒã·ã§ã³ã®äž»èŠãªããžãã¹ããžãã¯ãå«ãŸããŠããŸãã
ã¢ããªã±ãŒã·ã§ã³å±€ïŒã¢ããªã±ãŒã·ã§ã³ãµãŒãã¹ãã€ã³ã¿ã©ã¯ã·ã§ã³ãªããžã§ã¯ããå«ãŸããŸãããããã¯ããã¡ã€ã³å±€ã®ãªããžã§ã¯ãã䜿çšããŠãã¢ããªã±ãŒã·ã§ã³ã®äœ¿çšè
ã«å¯ŸããŠãµãŒãã¹ãæäŸããŸãã
ã€ã³ãã©ã¹ãã©ã¯ãã£å±€ïŒããŒã¿ããŒã¹ã¢ã¯ã»ã¹ãéä¿¡ãªã©ã®äœã¬ãã«ã®ã¿ã¹ã¯ãå«ãŸããŸãã
TypeScriptã§DDDãå®è£
ããå Žåããã¡ã€ã³å±€ã¯ã¯ã©ã¹ãã€ã³ã¿ãŒãã§ã€ã¹ã䜿çšããŠã¢ãã«åããã¢ããªã±ãŒã·ã§ã³å±€ã¯ãµãŒãã¹ã¯ã©ã¹ã䜿çšããã€ã³ãã©ã¹ãã©ã¯ãã£å±€ã¯ repository ãã¿ãŒã³ã䜿çšããŸãã
以äžã«äŸã瀺ããŸã
class Order {
// ãã¡ã€ã³ã¢ãã«ã®ããããã£
private items: OrderItem[] = [];
private customer: Customer;
// ãã¡ã€ã³ããžãã¯
addItem(item: OrderItem) {
this.items.push(item);
}
calculateTotal(): number {
return this.items.reduce((total, item) => total + item.price, 0);
}
}
class OrderService {
// ã¢ããªã±ãŒã·ã§ã³ãµãŒãã¹
private orderRepository: OrderRepository;
constructor(orderRepository: OrderRepository) {
this.orderRepository = orderRepository;
}
createOrder(customerId: string, items: OrderItem[]) {
const customer = this.customerRepository.getById(customerId);
const order = new Order(customer);
items.forEach(item => order.addItem(item));
this.orderRepository.save(order);
}
}
class OrderRepository {
// ã€ã³ãã©ã¹ãã©ã¯ãã£å±€
private orders: Order[] = [];
save(order: Order) {
this.orders.push(order);
}
getById(id: string): Order {
// ã¢ããªã±ãŒã·ã§ã³ã®äžã§äœ¿çšãããããžãã¯ãå®è£
return this.orders.find(order => order.id === id);
}
}
ãã®ããã«ãTypeScriptã§DDDãå®è£
ããããã«ã¯ã
ããããã®ã¬ã€ã€ãŒã«ã€ããŠãã¯ã©ã¹ãã€ã³ã¿ãŒãã§ã€ã¹ã䜿çšãã
é©åãªããžãã¯ãå®è£
ããŠããããšãéèŠã§ãã
ããã¯äžäŸã§ãããå®éã®ã¢ããªã±ãŒã·ã§ã³ã§ã¯ã
ããå°ãè€éã§è€éãªããžãã¯ãå¿
èŠã«ãªãããšããããŸãã
DDD (Domain-Driven Design)ãTypeScriptã§å®è£
ããéã®
ãµã³ãã«ã³ãŒãã瀺ããŸãã
以äžã«ãç°¡åãªe-commerceã¢ããªã±ãŒã·ã§ã³ã®äŸã瀺ããŸãã
ãã¡ã€ã³å±€ã§ã¯ãProductãšOrderã®ã¯ã©ã¹ãå®çŸ©ããŸãã
class Product {
constructor(
private id: string,
private name: string,
private price: number
) {}
getId() { return this.id }
getName() { return this.name }
getPrice() { return this.price }
}
class Order {
private id: string;
private products: Product[];
private createdAt: Date;
constructor(id: string, products: Product[]) {
this.id = id;
this.products = products;
this.createdAt = new Date();
}
getId() { return this.id }
getProducts() { return this.products }
getCreatedAt() { return this.createdAt }
getTotalPrice(): number {
return this.products.reduce((total, product) => total + product.getPrice(), 0);
}
}
ã¢ããªã±ãŒã·ã§ã³å±€ã§ã¯ãOrderServiceã¯ã©ã¹ãå®çŸ©ããŸãããã®ã¯ã©ã¹ã¯ãOrderãäœæããOrderRepositoryã«ä¿åããããã®ããžãã¯ãæã£ãŠããŸãã
class OrderService {
private orderRepository: OrderRepository;
constructor(orderRepository: OrderRepository) {
this.orderRepository = orderRepository;
}
createOrder(products: Product[]): Order {
const id = generateId();
const order = new Order(id, products);
this.orderRepository.save(order);
return order;
}
}
ã€ã³ãã©ã¹ãã©ã¯ãã£å±€ã§ã¯ãOrderRepositoryã¯ã©ã¹ãå®çŸ©ããŸãã
ãã®ã¯ã©ã¹ã¯ãOrderãä¿åããååŸããããã®ããžãã¯ãæã£ãŠããŸãã
class OrderRepository {
private orders: Order[] = [];
save(order: Order) {
this.orders.push(order);
}
getById(id: string): Order {
return this.orders.find(order => order.getId() === id);
}
}
ããã¯ãTypeScriptã§DDDãå®è£
ããäžäŸã§ããå®éã®ã¢ããªã±ãŒã·ã§ã³ã§ã¯ããã£ãšè€éãªããžãã¯ãæ§é ãå¿
èŠã«ãªãããšããããŸãã
ããã§ç€ºããã³ãŒãã¯åçŽãªäŸã§ãããå®éã®ã¢ããªã±ãŒã·ã§ã³ã§äœ¿çšããã«ã¯
ã¢ããªã±ãŒã·ã§ã³ãæ§ç¯ããããã«å¿
èŠãªãã¯ããã¯ãé©çšããããšãéèŠã§ãã
å®éã«äœ¿çšããéã«ã¯ãã¢ããªã±ãŒã·ã§ã³ã«å¿
èŠãªããžãã¯ãé©åã«å®è£
ãã
æè»ãªæ§é ã«ããããšã倧åã§ãã
ãŸããDDDã¯è€éãªã¢ããªã±ãŒã·ã§ã³ãèšèšããããã®ã¢ãããŒãã§ããã
å®éã«ã¯è€æ°ã®ãã¿ãŒã³ããã¯ããã¯ãçµã¿åãããŠäœ¿çšããããšãå¿
èŠã«ãªããŸãã
質åå
容ã®ãã§ã€ã¹ãè¯ããªãã£ãã§ããã
ãã¯ãã¡ãããšæžç±çã§åŠãã æ¹ãè¯ãããã§ãã
ããŒã¿ããŒã¹èšèšãææ¡ããŠããã
ãªããšãã<appæ©èœ>ã®ããŒã¿ããŒã¹èšèšããŠããšå
¥åããã°ææ¡ããããŸãã
äŸïŒãã£ããæ©èœã®ããŒã¿ããŒã¹èšèšããŠ
å®åã«ã¯å°åºèããããªãã§ãããåçãããããšèªäœãåãã§ããã
çšéã®éããæããŠããã
ããããã®çšéã®éãã«ã€ããŠæããŠããããŸãã
ã<A> ãš <B> ã®éããæããŠã
äŸïŒvue.jsã®watchãšwatchEffectã®éããæããŠ
è±åèªã®éããæããŠããã
åœåæãªã©ã«è¿·ã£ãŠããŸããããªã䜿ãåããæç¢ºã§ãªãè±åèªãæããŠããããŸãã
äŸïŒhopeãšwishã®éããæããŠ
ãã®ä»ã®æŽ»ç𿹿³
ãã®ä»ã®æŽ»çšæ³ã«ã€ããŠã¯ä»¥äžã®èšäºã«ãŠç޹ä»ããŠããŸãã
ææ³
æã
埮åŠãªç®æããããå
šãŠéµåã¿ã«ããŠããŸãã®ã¯ããªãå±éºãªã®ã§ã
ãã¯ãèªåã§è©³çŽ°ãææ¡ããŠæ£ãã倿ããåã¯å¿
èŠã§ãããäœ¿ãæ¹ã¯ç¡éã«åºããããã§ãã¡ããã¡ãåããªãšæããŸããã
â»å©çšã¯ãããããæ³šæãå人責任ã§â»



















