Nguyễn Hữu Kim

Thử check thêm Observer nữa xem bạn

Lỗi này do extension cài bên Linode thiết lập chặn IP máy em. Cảm ơn mọi người rất nhiều vì đã vào support.

Một giải pháp khá đơn giản là sử dụng CSS để style lại chiều rộng của các thẻ th, td. Các này hơi tù nhưng mà đơn giản nhất để hotfix. Bằng cách sử dụng CSS:

#table-1 th, #table-2 td {
  width: 200px;
}

Kết hợp nth-child() hoặc một unique id của cột để tinh chỉnh kích thước riêng biệt cho từng cột.

#table-1 th:nth-child(3),
#table-2 td:nth-child(3),
#table-1 th[data-id="column-3"],
#table-2 td[data-id="column-3"] {
  width: 100px;
}

Ngoài ra, phức tạp hơn một chút thì bạn kết sử dụng CSS và javascript, duyệt danh sách các cặp thẻ #table-1 th và #table-2 td tương ứng. Lấy độ rộng của thẻ lớn hơn và dùng nó để set chiều rộng cho thẻ còn lại. Có thể để max width bằng CSS để độ rộng một cột không quá lớn. Với cách này thì độ rộng không bị hard code như cách 1 và mềm mại hơn.

Trên đây là ý tưởng của mình, bạn thử xem áp dụng xem sao nhé.

Chắc hẳn bạn cũng đã biết Session là khái niệm cơ bản khi bắt đầu bước chân vào lập trình web mà bất cứ lập trình viên web nào đều nắm được.

• Khi có một request tới server, server tiếp nhận request thì lúc này một phiên làm việc giữa server và client được bắt đầu. Trong một phiên làm việc, server sẽ cần lưu trữ một số thông tin để thuận tiện xử lý trong các request tiếp theo của client. VD như thông tin định danh sau khi đăng nhập (vì chỉ đăng nhập một lần chứ ai mỗi lần request lại phải đăng nhập lại).
• Session là thành phần trên server phản ánh một phiên làm việc. Session có Session Store để cho phép lưu trữ dữ liệu trong một phiên. Tất nhiên, cái store này sẽ ở trên server và hiển nhiên dữ liệu được lưu trên server. Tùy thuộc bạn implement cái Store như nào mà dữ liệu sẽ được lưu vào RAM, lưu trực tiếp ra file hoặc lưu vào database hay Redis. Hầu hết newbie mới tìm hiểu về session sẽ thắc mắc rằng session lưu trên server vậy làm sao server biết session nào thuộc client nào. Thực ra, mỗi session được định danh bằng một ID, ID này được response lại client và lưu vào Cookie để sử dụng trong các lần request tiếp theo. (Cookie được lưu ở trình duyệt của client).
• Cái package express-session nó implement việc tạo ra thành phần session trong express. Cho phép bạn thực hiện thao tác lưu trữ dữ liệu vào session linh hoạt qua truy cập req.session**. Nếu bạn chỉ cài mỗi express-session thì cái Session Store mặc định đang lưu vào RAM của server nhé!
• Đôi khi, dữ liệu bạn muốn lưu vào session và chỉ để dùng một lần duy nhất. VD: Bạn đang xử lý một request, trong khi xử lý request thì có lỗi phát sinh, bạn cần redirect tới một trang khác rồi hiển thị lỗi. Dữ liệu về lỗi bạn có thể lưu vào session để dùng một lần. Những dữ liệu được vào session để sử dụng như vậy người ta hay gọi là Flash Session (Flash ám chỉ nó chỉ tồn tại và biến mất trong một cái nháy mắt). Cái package thứ hai bạn đang dùng connect-flash nó implement cách xử lý Flash Session. Bạn chỉ cần lưu, các việc xóa phía sau package đấy đã xử lý.
• Còn vấn đề tại sao lưu Flash Session đơn giản vì người ta không muốn cho client nhìn thấy được dữ liệu. Chẳng hạn như việc redirect, sẽ ra sao khi bạn lưu vào query string trên URL???

Bạn bị nhầm rồi! Ngoài việc style màu bằng mã hexa thì CSS hỗ trợ sử dụng theo tên màu đã được quy ước trước hay nó còn được gọi là Predefined/Cross-browser color names. Trong danh sách tên màu này thì chỉ có một cái tên là chocolate chứ không có chocolate1 hay chocolate2 đâu nhé! Do đó các giá trị chocolate1, chocolate2 là không hợp lệ và trình duyệt sẽ không hiểu đó là màu nào.

Bạn có thể kiểm tra và tham khảo trong danh sách tên màu được các trình duyệt hỗ trợ ở đây nha: https://www.w3schools.com/colors/colors_names.asp

Nếu muốn share data giữa các services bạn khai báo volumes ở top-level, như sau:

version: '3'

volumes:
    backend:

services:
    ...

Bây giờ muốn dùng nó ở services thì bạn mount qua volumes trong service. Ví dụ:

version: '3'

volumes:
    backend:

services:
    application:
        container_name: project_application
        image: debian
        volumes:
            - backend:/var/www/project/backend
    workspace:
        container_name: project_workspace
        restart: always
        build:
            context: .
            dockerfile: ./docker/workspace/build/Dockerfile
        volumes:
            - backend:/var/www/project/backend
        tty: true

1. Bạn trỏ toàn bộ sub domain (hoặc là chỉ m.example.com) về chung host của thằng example.com
2. Bạn thêm ServerAlias cho cái example.com vào trong cấu hình apache của nó, để bất cứ request tới sub-domain sẽ đều vào web example.com (mình đoán bạn đang dùng Apache):

ServerAlias m.example.com

# Hoặc chấp nhận bất kỳ sub-domain nào:
ServerAlias *.example.com

3. Khi đảm bảo 2 bước trên thì việc còn lại là laravel xử lý như bạn đang làm và web sẽ hiện ra như bạn đang kỳ vọng.

Bạn nói đúng rồi đấy bạn. Mình cũng không biết là lý do gì. Cá nhân mình suy đoán như sau:

• Có thể là do hồi đấy (3 năm trước), repo này được dùng nhằm phục vụ việc trainning và chia sẻ kiến thức về docker, vì khi đó có thể Docker ở Framgia có thể còn khá mới lạ và ít project sử dụng. Để ubuntu nó thân quen sẽ dễ hình dung hơn.
• Có thể do team trong Framgia thích dùng ubuntu nên tác giả đã base trên ubuntu luôn chẳng hạn. Vì thói quen của tác giả lúc đấy đang quen code trên ubuntu, khi viết Dockerfile thì các lệnh setup như cài đặt phần mềm sẽ không bị thay đổi nên dễ/tiện setup hơn. VD:

# Ubuntu
apt-get install git

# Alpine
apk add git

• Ngoài ra, repository kia đã lâu rồi không còn thấy được contribute nên có thể tác giả cũng quên luôn việc optimize nó.

@stone89son Ý bạn đang hỏi về cái syntax này à:

const AsyncComponent = () => ({
  // The component to load (should be a Promise)
  component: import('./MyComponent.vue'),
  // A component to use while the async component is loading
  loading: LoadingComponent,
  // A component to use if the load fails
  error: ErrorComponent,
  // Delay before showing the loading component. Default: 200ms.
  delay: 200,
  // The error component will be displayed if a timeout is
  // provided and exceeded. Default: Infinity.
  timeout: 3000
})

Có vẻ bạn đang hiểu nhầm rồi, syntax kia (delay + timeout) là để xử lý việc hiển thị cái LoadingComponent và ErrorComponent thôi. Còn muốn dùng async thì cái property component bạn return một cái promise là được. Do là promise nên bạn thích set timeout bao nhiêu giây rồi mới resolve cũng được hết á.

Có vẻ vẫn là câu hỏi lần trước của bạn.

Mình nghĩ sau khi gửi request đăng nhập đi, nếu thành công bạn có thể lấy cookie trong header của response ra rồi lưu vào session phía bên web của bạn cũng được. Lần request tiếp theo bạn đọc từ session ra thôi. Mọi thứ cũng có vẻ đơn giản hơn.

Không liên quan lắm, nhưng mình nghĩ bạn dùng package GuzzleHttp để gửi request cho code nó dễ đọc hơn.

Mình đoán trường hợp của bạn, cái một trong 2 API của bạn nó là stateless API không có session. Do đó 2 request của bạn sẽ độc lập với nhau và không có căn cứ nào để server nó biết được là bạn đã đăng nhập ở request sau.

1. Nếu API login trả về không trả về accessToken, khả năng nó đang dùng session còn cái API thứ 2 nó là stateless chỉ dùng accessToken hoặc apiKey nên session sẽ bị vô tác dụng. Do đó request thứ 2 cho rằng bạn chưa đăng nhập.
2. Ngược lại thì API login có thể là stateless. Nếu giả định của mình đúng thì thường người ta sẽ cho response trả về chứa accessToken hoặc apiKey hoặc cái gì khác... để chứng mình rằng bạn đã đăng nhập. Bạn chỉ cần thêm cái accessToken hoặc apiKey vào header của request thứ 2 (header hay dùng là Authorization phụ thuộc vào server dùng như nào).

Ngoài ra, nếu cả hai request đều dùng session để chứng minh bạn đã đăng nhập, thì ở request thứ 2, bạn cần gửi thêm cookie lên kèm. Cookie là bằng chứng đề server biết rằng bạn đã đăng nhập.

Nếu bạn đang theo học PHP, bạn hãy cố gắng nắm vững các kiến thức cơ bản của ngôn ngữ lập trình này. Sử dụng biến, các toán tử, các câu lệnh rẽ nhánh, các kiến thức cơ bản về HTML, CSS, xử lý form.. thật nhuần nhuyễn. Sau đó bạn nắm các kiến thức về OOP, rồi chuyển qua nghiên cứu cái mô hình MVC để hiểu luồng chạy của hệ thống khi nhập một URL trên trình duyệt. Sau khi nắm các kiến thức trên rồi thì bạn nhảy vô đọc document của Laravel và chiến thôi .

Bạn thử Regex này xem?

1. Kiểm tra chuỗi là số:

/^\d+(?:.\d+)?$/

VD: 0.388

2. Kiểm tra trong một chuỗi có chứa số không:

/(\d+(?:.\d+)?)/

VD: "Hôm nay tôi trúng thưởng xổ số 50.000.000" => Số lấy ra theo regex: 50.000.000

3. Nếu số nhập có thể là số âm thì thêm (?:\+|\-):

1. /^(\+|\-)?\d+(?:.\d+)?$/
2. /((?:\+|\-)?\d+(?:.\d+)?)/

Bạn truy cập trang này https://viblo.asia/password/reset bằng trình duyệt ở chế độ ẩn danh rồi nhập email để nhận mã khôi phục mật khẩu nhé.

Cái form của bạn @luatvd có thể cải tiến làm như sau để dùng chung cho cả create và update

<template>
  <div>
    <label for="postname">Name</label>
    <input v-model="form.postName" placeholder="post name" id="postname" class="form-control">
    <label for="description">Description</label>
    <textarea v-model="form.description" cols="30" rows="10" class="form-control" id="description"></textarea>
    <button @click="$emit('submit', form)">Submit</button>
  </div>
</template>

<script>
    import _get from 'lodash/get'

    export default {
        props: {
            post: {
                type: Object,
                default: () => null
            }
        }

        data() {
            return {
                form: {
                    name: _get(this.post, 'name', ''),
                    description: _get(this.post, 'name', ''),
                    ...
                }
            }
        }
    }
</script>

Như bạn thấy:

• Trong form mình truyền post vào, nếu post không có thì default value là null.
• Lúc data của component được khởi tạo, mình sẽ gán giá trị từ prop post (nếu có) vào form trong component state.
• Khi nhấn submit thì mình bắn event submit ra cho component, với parametter là dữ liệu của biến form trong state.
• Component cha sẽ listen cái event submit và thực hiện làm hành động gì đó như create, update.

Bạn dùng thử Flex box đi bạn hoặc bạn search từ khóa Equal height columns xem các giải pháp khác ngoài flexbox. Giải pháp này làm tất cả các item trong grid sẽ tự động có chiều cao bằng nhau theo item có height lớn nhất. Bạn nên xem mẫu style sau với flex box trước.

Dùng Viblo SDK JS đi bạn, trong SDK có public bộ render Markdown của Viblo. Đầu vào của bạn chỉ cần là text viết theo cú pháp Markdown, đầu ra sẽ là HTML. ^^ Server chỉ cần in mã markdown ra một thẻ div chẳng hạn, rồi client sẽ dùng javascript để đọc markdown từ thẻ đấy rồi render ra HTML với Viblo SDK-JS. Hoặc cùng lắm thì dùng Node.js làm server side rendering, sẽ có thể sử dụng SDK-JS của Viblo để render markdown trên trực tiếp trên server side luôn thay vì dùng js dưới client để render.

Mời bạn tham khảo tạ Viblo SDK JS tại: https://viblo.asia/tools

Mình thấy string trong Ruby cũng có hàm split như trên javascript, bạn thử dùng cách của mình ở trên xem sao?

expression = "ROUND(SUM(F9:I9)/2,0)"
elements = expression.split(/(\(|\)|\:|\/)/)

Chỉnh sửa lại cấu trúc DB trong Laravel thì cứ migration mà táng thôi bạn. Bạn dùng git chứ? Sử dụng git rồi checkout code hiện tại ở master ra một branch khác, bạn sửa code trên branch đấy sao cho web hoạt động bình thường, không bị lỗi. Dữ liệu cũ vẫn được đảm bảo tồn tại và tương thích trên cấu trúc mới. Sau tất cả, chỉ cần merge branch này về master và thực hiện deploy thôi.

Còn nếu web nhỏ, chỉ deploy trên hosting thì ở bước deploy, bạn phải làm sửa cấu trúc thủ công thôi. Chuyển web về chế độ maintain mode, download cái database đó về, sau đó migrate ở local. Xong đâu đấy thì upload code mới lên, import database mới và tắt chế độ maintain mode.

Dấu () tức để để thực hiện luôn cái funciton đấy. Vì cái argument thứ 2 của setState nó nhận một function callback, callback này được chạy trong setState. Chính vì thế lúc này mình không có dấu () để callback không chạy trước khi setState chạy.