SlideShare a Scribd company logo
Creating a Facebook Clone - Part XV
© Codename One 2017 all rights reserved
public class NewPostForm extends Form {
private static final String[] POST_STYLES = {
"Label", "PostStyleHearts", "PostStyleHands", "PostStyleBlack",
"PostStyleRed", "PostStylePurple" };
public NewPostForm() {
super("Create Post", new BorderLayout());
Form current = getCurrentForm();
getToolbar().setBackCommand("Cancel",
Toolbar.BackCommandPolicy.
WHEN_USES_TITLE_OTHERWISE_ARROW,
e -> current.showBack());
getToolbar().addMaterialCommandToRightBar("",
FontImage.MATERIAL_DONE, e -> {});
User me = ServerAPI.me();
Container userSettings = BorderLayout.west(
new Label(me.getAvatar(6.5f), "HalfPaddedContainer"));
Button friends = new Button("Friends", "FriendCombo");
FontImage.setMaterialIcon(friends, FontImage.MATERIAL_PEOPLE);
userSettings.add(CENTER,
BoxLayout.encloseY(
new Label(me.fullName(), "MultiLine1"),
NewPostForm
public class NewPostForm extends Form {
private static final String[] POST_STYLES = {
"Label", "PostStyleHearts", "PostStyleHands", "PostStyleBlack",
"PostStyleRed", "PostStylePurple" };
public NewPostForm() {
super("Create Post", new BorderLayout());
Form current = getCurrentForm();
getToolbar().setBackCommand("Cancel",
Toolbar.BackCommandPolicy.
WHEN_USES_TITLE_OTHERWISE_ARROW,
e -> current.showBack());
getToolbar().addMaterialCommandToRightBar("",
FontImage.MATERIAL_DONE, e -> {});
User me = ServerAPI.me();
Container userSettings = BorderLayout.west(
new Label(me.getAvatar(6.5f), "HalfPaddedContainer"));
Button friends = new Button("Friends", "FriendCombo");
FontImage.setMaterialIcon(friends, FontImage.MATERIAL_PEOPLE);
userSettings.add(CENTER,
BoxLayout.encloseY(
new Label(me.fullName(), "MultiLine1"),
NewPostForm
public class NewPostForm extends Form {
private static final String[] POST_STYLES = {
"Label", "PostStyleHearts", "PostStyleHands", "PostStyleBlack",
"PostStyleRed", "PostStylePurple" };
public NewPostForm() {
super("Create Post", new BorderLayout());
Form current = getCurrentForm();
getToolbar().setBackCommand("Cancel",
Toolbar.BackCommandPolicy.
WHEN_USES_TITLE_OTHERWISE_ARROW,
e -> current.showBack());
getToolbar().addMaterialCommandToRightBar("",
FontImage.MATERIAL_DONE, e -> {});
User me = ServerAPI.me();
Container userSettings = BorderLayout.west(
new Label(me.getAvatar(6.5f), "HalfPaddedContainer"));
Button friends = new Button("Friends", "FriendCombo");
FontImage.setMaterialIcon(friends, FontImage.MATERIAL_PEOPLE);
userSettings.add(CENTER,
BoxLayout.encloseY(
new Label(me.fullName(), "MultiLine1"),
NewPostForm
public class NewPostForm extends Form {
private static final String[] POST_STYLES = {
"Label", "PostStyleHearts", "PostStyleHands", "PostStyleBlack",
"PostStyleRed", "PostStylePurple" };
public NewPostForm() {
super("Create Post", new BorderLayout());
Form current = getCurrentForm();
getToolbar().setBackCommand("Cancel",
Toolbar.BackCommandPolicy.
WHEN_USES_TITLE_OTHERWISE_ARROW,
e -> current.showBack());
getToolbar().addMaterialCommandToRightBar("",
FontImage.MATERIAL_DONE, e -> {});
User me = ServerAPI.me();
Container userSettings = BorderLayout.west(
new Label(me.getAvatar(6.5f), "HalfPaddedContainer"));
Button friends = new Button("Friends", "FriendCombo");
FontImage.setMaterialIcon(friends, FontImage.MATERIAL_PEOPLE);
userSettings.add(CENTER,
BoxLayout.encloseY(
new Label(me.fullName(), "MultiLine1"),
NewPostForm
public class NewPostForm extends Form {
private static final String[] POST_STYLES = {
"Label", "PostStyleHearts", "PostStyleHands", "PostStyleBlack",
"PostStyleRed", "PostStylePurple" };
public NewPostForm() {
super("Create Post", new BorderLayout());
Form current = getCurrentForm();
getToolbar().setBackCommand("Cancel",
Toolbar.BackCommandPolicy.
WHEN_USES_TITLE_OTHERWISE_ARROW,
e -> current.showBack());
getToolbar().addMaterialCommandToRightBar("",
FontImage.MATERIAL_DONE, e -> {});
User me = ServerAPI.me();
Container userSettings = BorderLayout.west(
new Label(me.getAvatar(6.5f), "HalfPaddedContainer"));
Button friends = new Button("Friends", "FriendCombo");
FontImage.setMaterialIcon(friends, FontImage.MATERIAL_PEOPLE);
userSettings.add(CENTER,
BoxLayout.encloseY(
new Label(me.fullName(), "MultiLine1"),
NewPostForm
e -> current.showBack());
getToolbar().addMaterialCommandToRightBar("",
FontImage.MATERIAL_DONE, e -> {});
User me = ServerAPI.me();
Container userSettings = BorderLayout.west(
new Label(me.getAvatar(6.5f), "HalfPaddedContainer"));
Button friends = new Button("Friends", "FriendCombo");
FontImage.setMaterialIcon(friends, FontImage.MATERIAL_PEOPLE);
userSettings.add(CENTER,
BoxLayout.encloseY(
new Label(me.fullName(), "MultiLine1"),
FlowLayout.encloseIn(friends)));
add(NORTH, userSettings);
TextArea post = new TextArea(3, 80);
post.setUIID("Label");
post.setGrowByContent(false);
Container postStyles = createPostStyles(post);
add(CENTER, LayeredLayout.encloseIn(
BorderLayout.north(post), BorderLayout.south(postStyles)));
setEditOnShow(post);
}
private Container createPostStyles(TextArea post) {
Container postStyles = new Container(BoxLayout.x());
NewPostForm
e -> current.showBack());
getToolbar().addMaterialCommandToRightBar("",
FontImage.MATERIAL_DONE, e -> {});
User me = ServerAPI.me();
Container userSettings = BorderLayout.west(
new Label(me.getAvatar(6.5f), "HalfPaddedContainer"));
Button friends = new Button("Friends", "FriendCombo");
FontImage.setMaterialIcon(friends, FontImage.MATERIAL_PEOPLE);
userSettings.add(CENTER,
BoxLayout.encloseY(
new Label(me.fullName(), "MultiLine1"),
FlowLayout.encloseIn(friends)));
add(NORTH, userSettings);
TextArea post = new TextArea(3, 80);
post.setUIID("Label");
post.setGrowByContent(false);
Container postStyles = createPostStyles(post);
add(CENTER, LayeredLayout.encloseIn(
BorderLayout.north(post), BorderLayout.south(postStyles)));
setEditOnShow(post);
}
private Container createPostStyles(TextArea post) {
Container postStyles = new Container(BoxLayout.x());
NewPostForm
setEditOnShow(post);
}
private Container createPostStyles(TextArea post) {
Container postStyles = new Container(BoxLayout.x());
postStyles.setScrollableX(true);
int size = convertToPixels(8);
ButtonGroup bg = new ButtonGroup();
for(String s : POST_STYLES) {
Button postStyleButton = RadioButton.createToggle("", bg);
postStyleButton.setShowEvenIfBlank(true);
postStyleButton.setUIID(s);
Style stl = postStyleButton.getAllStyles();
stl.setBorder(RoundRectBorder.create());
stl.setPadding(3, 3, 3, 3);
stl.setMarginUnit(Style.UNIT_TYPE_DIPS);
stl.setMargin(1, 1, 1, 1);
int strokeColor = 0xffffff;
if(s.equals("Label")) {
stl.setBgTransparency(255);
stl.setBgColor(0xffffff);
strokeColor = 0;
}
postStyleButton.getPressedStyle().setBorder(RoundRectBorder.
NewPostForm
setEditOnShow(post);
}
private Container createPostStyles(TextArea post) {
Container postStyles = new Container(BoxLayout.x());
postStyles.setScrollableX(true);
int size = convertToPixels(8);
ButtonGroup bg = new ButtonGroup();
for(String s : POST_STYLES) {
Button postStyleButton = RadioButton.createToggle("", bg);
postStyleButton.setShowEvenIfBlank(true);
postStyleButton.setUIID(s);
Style stl = postStyleButton.getAllStyles();
stl.setBorder(RoundRectBorder.create());
stl.setPadding(3, 3, 3, 3);
stl.setMarginUnit(Style.UNIT_TYPE_DIPS);
stl.setMargin(1, 1, 1, 1);
int strokeColor = 0xffffff;
if(s.equals("Label")) {
stl.setBgTransparency(255);
stl.setBgColor(0xffffff);
strokeColor = 0;
}
postStyleButton.getPressedStyle().setBorder(RoundRectBorder.
NewPostForm
setEditOnShow(post);
}
private Container createPostStyles(TextArea post) {
Container postStyles = new Container(BoxLayout.x());
postStyles.setScrollableX(true);
int size = convertToPixels(8);
ButtonGroup bg = new ButtonGroup();
for(String s : POST_STYLES) {
Button postStyleButton = RadioButton.createToggle("", bg);
postStyleButton.setShowEvenIfBlank(true);
postStyleButton.setUIID(s);
Style stl = postStyleButton.getAllStyles();
stl.setBorder(RoundRectBorder.create());
stl.setPadding(3, 3, 3, 3);
stl.setMarginUnit(Style.UNIT_TYPE_DIPS);
stl.setMargin(1, 1, 1, 1);
int strokeColor = 0xffffff;
if(s.equals("Label")) {
stl.setBgTransparency(255);
stl.setBgColor(0xffffff);
strokeColor = 0;
}
postStyleButton.getPressedStyle().setBorder(RoundRectBorder.
NewPostForm
private Container createPostStyles(TextArea post) {
Container postStyles = new Container(BoxLayout.x());
postStyles.setScrollableX(true);
int size = convertToPixels(8);
ButtonGroup bg = new ButtonGroup();
for(String s : POST_STYLES) {
Button postStyleButton = RadioButton.createToggle("", bg);
postStyleButton.setShowEvenIfBlank(true);
postStyleButton.setUIID(s);
Style stl = postStyleButton.getAllStyles();
stl.setBorder(RoundRectBorder.create());
stl.setPadding(3, 3, 3, 3);
stl.setMarginUnit(Style.UNIT_TYPE_DIPS);
stl.setMargin(1, 1, 1, 1);
int strokeColor = 0xffffff;
if(s.equals("Label")) {
stl.setBgTransparency(255);
stl.setBgColor(0xffffff);
strokeColor = 0;
}
postStyleButton.getPressedStyle().setBorder(RoundRectBorder.
create().strokeColor(strokeColor).
strokeOpacity(255).
stroke(0.5f, true));
postStyleButton.addActionListener(e -> changeStyle(post, s));
NewPostForm
private Container createPostStyles(TextArea post) {
Container postStyles = new Container(BoxLayout.x());
postStyles.setScrollableX(true);
int size = convertToPixels(8);
ButtonGroup bg = new ButtonGroup();
for(String s : POST_STYLES) {
Button postStyleButton = RadioButton.createToggle("", bg);
postStyleButton.setShowEvenIfBlank(true);
postStyleButton.setUIID(s);
Style stl = postStyleButton.getAllStyles();
stl.setBorder(RoundRectBorder.create());
stl.setPadding(3, 3, 3, 3);
stl.setMarginUnit(Style.UNIT_TYPE_DIPS);
stl.setMargin(1, 1, 1, 1);
int strokeColor = 0xffffff;
if(s.equals("Label")) {
stl.setBgTransparency(255);
stl.setBgColor(0xffffff);
strokeColor = 0;
}
postStyleButton.getPressedStyle().setBorder(RoundRectBorder.
create().strokeColor(strokeColor).
strokeOpacity(255).
stroke(0.5f, true));
postStyleButton.addActionListener(e -> changeStyle(post, s));
NewPostForm
private Container createPostStyles(TextArea post) {
Container postStyles = new Container(BoxLayout.x());
postStyles.setScrollableX(true);
int size = convertToPixels(8);
ButtonGroup bg = new ButtonGroup();
for(String s : POST_STYLES) {
Button postStyleButton = RadioButton.createToggle("", bg);
postStyleButton.setShowEvenIfBlank(true);
postStyleButton.setUIID(s);
Style stl = postStyleButton.getAllStyles();
stl.setBorder(RoundRectBorder.create());
stl.setPadding(3, 3, 3, 3);
stl.setMarginUnit(Style.UNIT_TYPE_DIPS);
stl.setMargin(1, 1, 1, 1);
int strokeColor = 0xffffff;
if(s.equals("Label")) {
stl.setBgTransparency(255);
stl.setBgColor(0xffffff);
strokeColor = 0;
}
postStyleButton.getPressedStyle().setBorder(RoundRectBorder.
create().strokeColor(strokeColor).
strokeOpacity(255).
stroke(0.5f, true));
postStyleButton.addActionListener(e -> changeStyle(post, s));
NewPostForm
private Container createPostStyles(TextArea post) {
Container postStyles = new Container(BoxLayout.x());
postStyles.setScrollableX(true);
int size = convertToPixels(8);
ButtonGroup bg = new ButtonGroup();
for(String s : POST_STYLES) {
Button postStyleButton = RadioButton.createToggle("", bg);
postStyleButton.setShowEvenIfBlank(true);
postStyleButton.setUIID(s);
Style stl = postStyleButton.getAllStyles();
stl.setBorder(RoundRectBorder.create());
stl.setPadding(3, 3, 3, 3);
stl.setMarginUnit(Style.UNIT_TYPE_DIPS);
stl.setMargin(1, 1, 1, 1);
int strokeColor = 0xffffff;
if(s.equals("Label")) {
stl.setBgTransparency(255);
stl.setBgColor(0xffffff);
strokeColor = 0;
}
postStyleButton.getPressedStyle().setBorder(RoundRectBorder.
create().strokeColor(strokeColor).
strokeOpacity(255).
stroke(0.5f, true));
postStyleButton.addActionListener(e -> changeStyle(post, s));
NewPostForm
Button postStyleButton = RadioButton.createToggle("", bg);
postStyleButton.setShowEvenIfBlank(true);
postStyleButton.setUIID(s);
Style stl = postStyleButton.getAllStyles();
stl.setBorder(RoundRectBorder.create());
stl.setPadding(3, 3, 3, 3);
stl.setMarginUnit(Style.UNIT_TYPE_DIPS);
stl.setMargin(1, 1, 1, 1);
int strokeColor = 0xffffff;
if(s.equals("Label")) {
stl.setBgTransparency(255);
stl.setBgColor(0xffffff);
strokeColor = 0;
}
postStyleButton.getPressedStyle().setBorder(RoundRectBorder.
create().strokeColor(strokeColor).
strokeOpacity(255).
stroke(0.5f, true));
postStyleButton.addActionListener(e -> changeStyle(post, s));
postStyleButton.setPreferredSize(new Dimension(size, size));
postStyles.add(postStyleButton);
}
return postStyles;
}
NewPostForm
Button postStyleButton = RadioButton.createToggle("", bg);
postStyleButton.setShowEvenIfBlank(true);
postStyleButton.setUIID(s);
Style stl = postStyleButton.getAllStyles();
stl.setBorder(RoundRectBorder.create());
stl.setPadding(3, 3, 3, 3);
stl.setMarginUnit(Style.UNIT_TYPE_DIPS);
stl.setMargin(1, 1, 1, 1);
int strokeColor = 0xffffff;
if(s.equals("Label")) {
stl.setBgTransparency(255);
stl.setBgColor(0xffffff);
strokeColor = 0;
}
postStyleButton.getPressedStyle().setBorder(RoundRectBorder.
create().strokeColor(strokeColor).
strokeOpacity(255).
stroke(0.5f, true));
postStyleButton.addActionListener(e -> changeStyle(post, s));
postStyleButton.setPreferredSize(new Dimension(size, size));
postStyles.add(postStyleButton);
}
return postStyles;
}
NewPostForm
}
postStyleButton.getPressedStyle().setBorder(RoundRectBorder.
create().strokeColor(strokeColor).
strokeOpacity(255).
stroke(0.5f, true));
postStyleButton.addActionListener(e -> changeStyle(post, s));
postStyleButton.setPreferredSize(new Dimension(size, size));
postStyles.add(postStyleButton);
}
return postStyles;
}
private void changeStyle(TextArea post, String s) {
if(s.equals("Label")) {
post.setUIID(s);
post.getParent().setUIID("Container");
} else {
post.setUIID("PostStyleText");
post.getParent().setUIID(s);
}
revalidate();
}
}
NewPostForm
}
postStyleButton.getPressedStyle().setBorder(RoundRectBorder.
create().strokeColor(strokeColor).
strokeOpacity(255).
stroke(0.5f, true));
postStyleButton.addActionListener(e -> changeStyle(post, s));
postStyleButton.setPreferredSize(new Dimension(size, size));
postStyles.add(postStyleButton);
}
return postStyles;
}
private void changeStyle(TextArea post, String s) {
if(s.equals("Label")) {
post.setUIID(s);
post.getParent().setUIID("Container");
} else {
post.setUIID("PostStyleText");
post.getParent().setUIID(s);
}
revalidate();
}
}
NewPostForm
}
postStyleButton.getPressedStyle().setBorder(RoundRectBorder.
create().strokeColor(strokeColor).
strokeOpacity(255).
stroke(0.5f, true));
postStyleButton.addActionListener(e -> changeStyle(post, s));
postStyleButton.setPreferredSize(new Dimension(size, size));
postStyles.add(postStyleButton);
}
return postStyles;
}
private void changeStyle(TextArea post, String s) {
if(s.equals("Label")) {
post.setUIID(s);
post.getParent().setUIID("Container");
} else {
post.setUIID("PostStyleText");
post.getParent().setUIID(s);
}
revalidate();
}
}
NewPostForm
}
if(p.comments.size() > 0) {
stats.add(EAST, new Label(p.comments.size() + " comments",
"SmallLabel"));
}
return stats;
}
private Container createPostBar() {
Button avatar = new Button(ServerAPI.me().getAvatar(6.5f), "Label");
Button writePost = new Button("What's on your mind?",
"NewPostButton");
Button gallery = new Button("Photo", "GalleryButton");
FontImage.setMaterialIcon(gallery,
FontImage.MATERIAL_PHOTO_LIBRARY, 2.9f);
gallery.setTextPosition(BOTTOM);
Container c = BorderLayout.
centerEastWest(writePost, gallery, avatar);
c.setUIID("HalfPaddedContainer");
writePost.addActionListener(e -> new NewPostForm().show());
return c;
}
}
NewsfeedContainer
FriendCombo {
padding: 2mm;
margin: 1mm;
border-radius: 1mm;
border-width: 1px;
border-color: gray;
background: transparent;
color: gray;
font-family: "native:MainLight";
font-size: 2.6mm;
}
PostStyleBase {
background-color: black;
color: white;
padding: 3mm;
text-align: center;
font-family: "native:MainRegular";
font-size: 4.5mm;
}
PostStyleHearts {
cn1-derive: PostStyleBase;
theme.css
FriendCombo {
padding: 2mm;
margin: 1mm;
border-radius: 1mm;
border-width: 1px;
border-color: gray;
background: transparent;
color: gray;
font-family: "native:MainLight";
font-size: 2.6mm;
}
PostStyleBase {
background-color: black;
color: white;
padding: 3mm;
text-align: center;
font-family: "native:MainRegular";
font-size: 4.5mm;
}
PostStyleHearts {
cn1-derive: PostStyleBase;
theme.css
padding: 3mm;
text-align: center;
font-family: "native:MainRegular";
font-size: 4.5mm;
}
PostStyleHearts {
cn1-derive: PostStyleBase;
background-image: url(images/hearts.jpg);
cn1-source-dpi: 0;
cn1-background-type: cn1-image-scaled-fill;
}
PostStyleHands {
cn1-derive: PostStyleBase;
background-image: url(images/hands.jpg);
cn1-source-dpi: 0;
cn1-background-type: cn1-image-scaled-fit;
background: #243761;
}
PostStyleBlack {
cn1-derive: PostStyleBase;
}
PostStyleRed {
cn1-derive: PostStyleBase;
background: red;
theme.css
cn1-source-dpi: 0;
cn1-background-type: cn1-image-scaled-fill;
}
PostStyleHands {
cn1-derive: PostStyleBase;
background-image: url(images/hands.jpg);
cn1-source-dpi: 0;
cn1-background-type: cn1-image-scaled-fit;
background: #243761;
}
PostStyleBlack {
cn1-derive: PostStyleBase;
}
PostStyleRed {
cn1-derive: PostStyleBase;
background: red;
}
PostStylePurple {
cn1-derive: PostStyleBase;
background: #c600ff;
}
PostStyleText {
background: transparent;
color: white;
theme.css
background-image: url(images/hands.jpg);
cn1-source-dpi: 0;
cn1-background-type: cn1-image-scaled-fit;
background: #243761;
}
PostStyleBlack {
cn1-derive: PostStyleBase;
}
PostStyleRed {
cn1-derive: PostStyleBase;
background: red;
}
PostStylePurple {
cn1-derive: PostStyleBase;
background: #c600ff;
}
PostStyleText {
background: transparent;
color: white;
padding: 1.5mm;
text-align: center;
font-family: "native:MainRegular";
font-size: 3.5mm;
}
theme.css
background-image: url(images/hands.jpg);
cn1-source-dpi: 0;
cn1-background-type: cn1-image-scaled-fit;
background: #243761;
}
PostStyleBlack {
cn1-derive: PostStyleBase;
}
PostStyleRed {
cn1-derive: PostStyleBase;
background: red;
}
PostStylePurple {
cn1-derive: PostStyleBase;
background: #c600ff;
}
PostStyleText {
background: transparent;
color: white;
padding: 1.5mm;
text-align: center;
font-family: "native:MainRegular";
font-size: 3.5mm;
}
theme.css

More Related Content

Similar to Creating a Facebook Clone - Part XVI.pdf

Creating a Facebook Clone - Part XXIX - Transcript.pdf
Creating a Facebook Clone - Part XXIX - Transcript.pdfCreating a Facebook Clone - Part XXIX - Transcript.pdf
Creating a Facebook Clone - Part XXIX - Transcript.pdf
ShaiAlmog1
 
Creating a Facebook Clone - Part XLII.pdf
Creating a Facebook Clone - Part XLII.pdfCreating a Facebook Clone - Part XLII.pdf
Creating a Facebook Clone - Part XLII.pdf
ShaiAlmog1
 
Creating a Facebook Clone - Part XXVIII.pdf
Creating a Facebook Clone - Part XXVIII.pdfCreating a Facebook Clone - Part XXVIII.pdf
Creating a Facebook Clone - Part XXVIII.pdf
ShaiAlmog1
 
Creating a Facebook Clone - Part XII.pdf
Creating a Facebook Clone - Part XII.pdfCreating a Facebook Clone - Part XII.pdf
Creating a Facebook Clone - Part XII.pdf
ShaiAlmog1
 
Creating an Uber Clone - Part XXXIX.pdf
Creating an Uber Clone - Part XXXIX.pdfCreating an Uber Clone - Part XXXIX.pdf
Creating an Uber Clone - Part XXXIX.pdf
ShaiAlmog1
 
2. Section 2. Implementing functionality in the PersonEntry. (1.5 ma.pdf
2. Section 2. Implementing functionality in the PersonEntry. (1.5 ma.pdf2. Section 2. Implementing functionality in the PersonEntry. (1.5 ma.pdf
2. Section 2. Implementing functionality in the PersonEntry. (1.5 ma.pdf
allwayscollection
 
Creating a Facebook Clone - Part XXVIII - Transcript.pdf
Creating a Facebook Clone - Part XXVIII - Transcript.pdfCreating a Facebook Clone - Part XXVIII - Transcript.pdf
Creating a Facebook Clone - Part XXVIII - Transcript.pdf
ShaiAlmog1
 
Creating a Facebook Clone - Part XV - Transcript.pdf
Creating a Facebook Clone - Part XV - Transcript.pdfCreating a Facebook Clone - Part XV - Transcript.pdf
Creating a Facebook Clone - Part XV - Transcript.pdf
ShaiAlmog1
 
Initial UI Mockup - Part 3 - Transcript.pdf
Initial UI Mockup - Part 3 - Transcript.pdfInitial UI Mockup - Part 3 - Transcript.pdf
Initial UI Mockup - Part 3 - Transcript.pdf
ShaiAlmog1
 
Creating a Facebook Clone - Part XXXV.pdf
Creating a Facebook Clone - Part XXXV.pdfCreating a Facebook Clone - Part XXXV.pdf
Creating a Facebook Clone - Part XXXV.pdf
ShaiAlmog1
 
Creating a Facebook Clone - Part XXX.pdf
Creating a Facebook Clone - Part XXX.pdfCreating a Facebook Clone - Part XXX.pdf
Creating a Facebook Clone - Part XXX.pdf
ShaiAlmog1
 
Creating a Facebook Clone - Part XXXVII.pdf
Creating a Facebook Clone - Part XXXVII.pdfCreating a Facebook Clone - Part XXXVII.pdf
Creating a Facebook Clone - Part XXXVII.pdf
ShaiAlmog1
 
Initial UI Mockup - Part 2.pdf
Initial UI Mockup - Part 2.pdfInitial UI Mockup - Part 2.pdf
Initial UI Mockup - Part 2.pdf
ShaiAlmog1
 
Creating an Uber Clone - Part XXXX - Transcript.pdf
Creating an Uber Clone - Part XXXX - Transcript.pdfCreating an Uber Clone - Part XXXX - Transcript.pdf
Creating an Uber Clone - Part XXXX - Transcript.pdf
ShaiAlmog1
 
Creating a Facebook Clone - Part XV.pdf
Creating a Facebook Clone - Part XV.pdfCreating a Facebook Clone - Part XV.pdf
Creating a Facebook Clone - Part XV.pdf
ShaiAlmog1
 
Creating a Facebook Clone - Part XLII - Transcript.pdf
Creating a Facebook Clone - Part XLII - Transcript.pdfCreating a Facebook Clone - Part XLII - Transcript.pdf
Creating a Facebook Clone - Part XLII - Transcript.pdf
ShaiAlmog1
 
Creating a Facebook Clone - Part XXXV - Transcript.pdf
Creating a Facebook Clone - Part XXXV - Transcript.pdfCreating a Facebook Clone - Part XXXV - Transcript.pdf
Creating a Facebook Clone - Part XXXV - Transcript.pdf
ShaiAlmog1
 
Creating an Uber Clone - Part XXXX.pdf
Creating an Uber Clone - Part XXXX.pdfCreating an Uber Clone - Part XXXX.pdf
Creating an Uber Clone - Part XXXX.pdf
ShaiAlmog1
 
Creating a Facebook Clone - Part IV.pdf
Creating a Facebook Clone - Part IV.pdfCreating a Facebook Clone - Part IV.pdf
Creating a Facebook Clone - Part IV.pdf
ShaiAlmog1
 

Similar to Creating a Facebook Clone - Part XVI.pdf (20)

Creating a Facebook Clone - Part XXIX - Transcript.pdf
Creating a Facebook Clone - Part XXIX - Transcript.pdfCreating a Facebook Clone - Part XXIX - Transcript.pdf
Creating a Facebook Clone - Part XXIX - Transcript.pdf
 
Creating a Facebook Clone - Part XLII.pdf
Creating a Facebook Clone - Part XLII.pdfCreating a Facebook Clone - Part XLII.pdf
Creating a Facebook Clone - Part XLII.pdf
 
Creating a Facebook Clone - Part XXVIII.pdf
Creating a Facebook Clone - Part XXVIII.pdfCreating a Facebook Clone - Part XXVIII.pdf
Creating a Facebook Clone - Part XXVIII.pdf
 
Creating a Facebook Clone - Part XII.pdf
Creating a Facebook Clone - Part XII.pdfCreating a Facebook Clone - Part XII.pdf
Creating a Facebook Clone - Part XII.pdf
 
Creating an Uber Clone - Part XXXIX.pdf
Creating an Uber Clone - Part XXXIX.pdfCreating an Uber Clone - Part XXXIX.pdf
Creating an Uber Clone - Part XXXIX.pdf
 
2. Section 2. Implementing functionality in the PersonEntry. (1.5 ma.pdf
2. Section 2. Implementing functionality in the PersonEntry. (1.5 ma.pdf2. Section 2. Implementing functionality in the PersonEntry. (1.5 ma.pdf
2. Section 2. Implementing functionality in the PersonEntry. (1.5 ma.pdf
 
Creating a Facebook Clone - Part XXVIII - Transcript.pdf
Creating a Facebook Clone - Part XXVIII - Transcript.pdfCreating a Facebook Clone - Part XXVIII - Transcript.pdf
Creating a Facebook Clone - Part XXVIII - Transcript.pdf
 
Creating a Facebook Clone - Part XV - Transcript.pdf
Creating a Facebook Clone - Part XV - Transcript.pdfCreating a Facebook Clone - Part XV - Transcript.pdf
Creating a Facebook Clone - Part XV - Transcript.pdf
 
Initial UI Mockup - Part 3 - Transcript.pdf
Initial UI Mockup - Part 3 - Transcript.pdfInitial UI Mockup - Part 3 - Transcript.pdf
Initial UI Mockup - Part 3 - Transcript.pdf
 
Creating a Facebook Clone - Part XXXV.pdf
Creating a Facebook Clone - Part XXXV.pdfCreating a Facebook Clone - Part XXXV.pdf
Creating a Facebook Clone - Part XXXV.pdf
 
Creating a Facebook Clone - Part XXX.pdf
Creating a Facebook Clone - Part XXX.pdfCreating a Facebook Clone - Part XXX.pdf
Creating a Facebook Clone - Part XXX.pdf
 
Creating a Facebook Clone - Part XXXVII.pdf
Creating a Facebook Clone - Part XXXVII.pdfCreating a Facebook Clone - Part XXXVII.pdf
Creating a Facebook Clone - Part XXXVII.pdf
 
Initial UI Mockup - Part 2.pdf
Initial UI Mockup - Part 2.pdfInitial UI Mockup - Part 2.pdf
Initial UI Mockup - Part 2.pdf
 
Oop lecture9 10
Oop lecture9 10Oop lecture9 10
Oop lecture9 10
 
Creating an Uber Clone - Part XXXX - Transcript.pdf
Creating an Uber Clone - Part XXXX - Transcript.pdfCreating an Uber Clone - Part XXXX - Transcript.pdf
Creating an Uber Clone - Part XXXX - Transcript.pdf
 
Creating a Facebook Clone - Part XV.pdf
Creating a Facebook Clone - Part XV.pdfCreating a Facebook Clone - Part XV.pdf
Creating a Facebook Clone - Part XV.pdf
 
Creating a Facebook Clone - Part XLII - Transcript.pdf
Creating a Facebook Clone - Part XLII - Transcript.pdfCreating a Facebook Clone - Part XLII - Transcript.pdf
Creating a Facebook Clone - Part XLII - Transcript.pdf
 
Creating a Facebook Clone - Part XXXV - Transcript.pdf
Creating a Facebook Clone - Part XXXV - Transcript.pdfCreating a Facebook Clone - Part XXXV - Transcript.pdf
Creating a Facebook Clone - Part XXXV - Transcript.pdf
 
Creating an Uber Clone - Part XXXX.pdf
Creating an Uber Clone - Part XXXX.pdfCreating an Uber Clone - Part XXXX.pdf
Creating an Uber Clone - Part XXXX.pdf
 
Creating a Facebook Clone - Part IV.pdf
Creating a Facebook Clone - Part IV.pdfCreating a Facebook Clone - Part IV.pdf
Creating a Facebook Clone - Part IV.pdf
 

More from ShaiAlmog1

The Duck Teaches Learn to debug from the masters. Local to production- kill ...
The Duck Teaches  Learn to debug from the masters. Local to production- kill ...The Duck Teaches  Learn to debug from the masters. Local to production- kill ...
The Duck Teaches Learn to debug from the masters. Local to production- kill ...
ShaiAlmog1
 
create-netflix-clone-06-client-ui.pdf
create-netflix-clone-06-client-ui.pdfcreate-netflix-clone-06-client-ui.pdf
create-netflix-clone-06-client-ui.pdf
ShaiAlmog1
 
create-netflix-clone-01-introduction_transcript.pdf
create-netflix-clone-01-introduction_transcript.pdfcreate-netflix-clone-01-introduction_transcript.pdf
create-netflix-clone-01-introduction_transcript.pdf
ShaiAlmog1
 
create-netflix-clone-02-server_transcript.pdf
create-netflix-clone-02-server_transcript.pdfcreate-netflix-clone-02-server_transcript.pdf
create-netflix-clone-02-server_transcript.pdf
ShaiAlmog1
 
create-netflix-clone-04-server-continued_transcript.pdf
create-netflix-clone-04-server-continued_transcript.pdfcreate-netflix-clone-04-server-continued_transcript.pdf
create-netflix-clone-04-server-continued_transcript.pdf
ShaiAlmog1
 
create-netflix-clone-01-introduction.pdf
create-netflix-clone-01-introduction.pdfcreate-netflix-clone-01-introduction.pdf
create-netflix-clone-01-introduction.pdf
ShaiAlmog1
 
create-netflix-clone-06-client-ui_transcript.pdf
create-netflix-clone-06-client-ui_transcript.pdfcreate-netflix-clone-06-client-ui_transcript.pdf
create-netflix-clone-06-client-ui_transcript.pdf
ShaiAlmog1
 
create-netflix-clone-03-server.pdf
create-netflix-clone-03-server.pdfcreate-netflix-clone-03-server.pdf
create-netflix-clone-03-server.pdf
ShaiAlmog1
 
create-netflix-clone-04-server-continued.pdf
create-netflix-clone-04-server-continued.pdfcreate-netflix-clone-04-server-continued.pdf
create-netflix-clone-04-server-continued.pdf
ShaiAlmog1
 
create-netflix-clone-05-client-model_transcript.pdf
create-netflix-clone-05-client-model_transcript.pdfcreate-netflix-clone-05-client-model_transcript.pdf
create-netflix-clone-05-client-model_transcript.pdf
ShaiAlmog1
 
create-netflix-clone-03-server_transcript.pdf
create-netflix-clone-03-server_transcript.pdfcreate-netflix-clone-03-server_transcript.pdf
create-netflix-clone-03-server_transcript.pdf
ShaiAlmog1
 
create-netflix-clone-02-server.pdf
create-netflix-clone-02-server.pdfcreate-netflix-clone-02-server.pdf
create-netflix-clone-02-server.pdf
ShaiAlmog1
 
create-netflix-clone-05-client-model.pdf
create-netflix-clone-05-client-model.pdfcreate-netflix-clone-05-client-model.pdf
create-netflix-clone-05-client-model.pdf
ShaiAlmog1
 
Creating a Whatsapp Clone - Part II.pdf
Creating a Whatsapp Clone - Part II.pdfCreating a Whatsapp Clone - Part II.pdf
Creating a Whatsapp Clone - Part II.pdf
ShaiAlmog1
 
Creating a Whatsapp Clone - Part IX - Transcript.pdf
Creating a Whatsapp Clone - Part IX - Transcript.pdfCreating a Whatsapp Clone - Part IX - Transcript.pdf
Creating a Whatsapp Clone - Part IX - Transcript.pdf
ShaiAlmog1
 
Creating a Whatsapp Clone - Part II - Transcript.pdf
Creating a Whatsapp Clone - Part II - Transcript.pdfCreating a Whatsapp Clone - Part II - Transcript.pdf
Creating a Whatsapp Clone - Part II - Transcript.pdf
ShaiAlmog1
 
Creating a Whatsapp Clone - Part V - Transcript.pdf
Creating a Whatsapp Clone - Part V - Transcript.pdfCreating a Whatsapp Clone - Part V - Transcript.pdf
Creating a Whatsapp Clone - Part V - Transcript.pdf
ShaiAlmog1
 
Creating a Whatsapp Clone - Part IV - Transcript.pdf
Creating a Whatsapp Clone - Part IV - Transcript.pdfCreating a Whatsapp Clone - Part IV - Transcript.pdf
Creating a Whatsapp Clone - Part IV - Transcript.pdf
ShaiAlmog1
 
Creating a Whatsapp Clone - Part IV.pdf
Creating a Whatsapp Clone - Part IV.pdfCreating a Whatsapp Clone - Part IV.pdf
Creating a Whatsapp Clone - Part IV.pdf
ShaiAlmog1
 
Creating a Whatsapp Clone - Part I - Transcript.pdf
Creating a Whatsapp Clone - Part I - Transcript.pdfCreating a Whatsapp Clone - Part I - Transcript.pdf
Creating a Whatsapp Clone - Part I - Transcript.pdf
ShaiAlmog1
 

More from ShaiAlmog1 (20)

The Duck Teaches Learn to debug from the masters. Local to production- kill ...
The Duck Teaches  Learn to debug from the masters. Local to production- kill ...The Duck Teaches  Learn to debug from the masters. Local to production- kill ...
The Duck Teaches Learn to debug from the masters. Local to production- kill ...
 
create-netflix-clone-06-client-ui.pdf
create-netflix-clone-06-client-ui.pdfcreate-netflix-clone-06-client-ui.pdf
create-netflix-clone-06-client-ui.pdf
 
create-netflix-clone-01-introduction_transcript.pdf
create-netflix-clone-01-introduction_transcript.pdfcreate-netflix-clone-01-introduction_transcript.pdf
create-netflix-clone-01-introduction_transcript.pdf
 
create-netflix-clone-02-server_transcript.pdf
create-netflix-clone-02-server_transcript.pdfcreate-netflix-clone-02-server_transcript.pdf
create-netflix-clone-02-server_transcript.pdf
 
create-netflix-clone-04-server-continued_transcript.pdf
create-netflix-clone-04-server-continued_transcript.pdfcreate-netflix-clone-04-server-continued_transcript.pdf
create-netflix-clone-04-server-continued_transcript.pdf
 
create-netflix-clone-01-introduction.pdf
create-netflix-clone-01-introduction.pdfcreate-netflix-clone-01-introduction.pdf
create-netflix-clone-01-introduction.pdf
 
create-netflix-clone-06-client-ui_transcript.pdf
create-netflix-clone-06-client-ui_transcript.pdfcreate-netflix-clone-06-client-ui_transcript.pdf
create-netflix-clone-06-client-ui_transcript.pdf
 
create-netflix-clone-03-server.pdf
create-netflix-clone-03-server.pdfcreate-netflix-clone-03-server.pdf
create-netflix-clone-03-server.pdf
 
create-netflix-clone-04-server-continued.pdf
create-netflix-clone-04-server-continued.pdfcreate-netflix-clone-04-server-continued.pdf
create-netflix-clone-04-server-continued.pdf
 
create-netflix-clone-05-client-model_transcript.pdf
create-netflix-clone-05-client-model_transcript.pdfcreate-netflix-clone-05-client-model_transcript.pdf
create-netflix-clone-05-client-model_transcript.pdf
 
create-netflix-clone-03-server_transcript.pdf
create-netflix-clone-03-server_transcript.pdfcreate-netflix-clone-03-server_transcript.pdf
create-netflix-clone-03-server_transcript.pdf
 
create-netflix-clone-02-server.pdf
create-netflix-clone-02-server.pdfcreate-netflix-clone-02-server.pdf
create-netflix-clone-02-server.pdf
 
create-netflix-clone-05-client-model.pdf
create-netflix-clone-05-client-model.pdfcreate-netflix-clone-05-client-model.pdf
create-netflix-clone-05-client-model.pdf
 
Creating a Whatsapp Clone - Part II.pdf
Creating a Whatsapp Clone - Part II.pdfCreating a Whatsapp Clone - Part II.pdf
Creating a Whatsapp Clone - Part II.pdf
 
Creating a Whatsapp Clone - Part IX - Transcript.pdf
Creating a Whatsapp Clone - Part IX - Transcript.pdfCreating a Whatsapp Clone - Part IX - Transcript.pdf
Creating a Whatsapp Clone - Part IX - Transcript.pdf
 
Creating a Whatsapp Clone - Part II - Transcript.pdf
Creating a Whatsapp Clone - Part II - Transcript.pdfCreating a Whatsapp Clone - Part II - Transcript.pdf
Creating a Whatsapp Clone - Part II - Transcript.pdf
 
Creating a Whatsapp Clone - Part V - Transcript.pdf
Creating a Whatsapp Clone - Part V - Transcript.pdfCreating a Whatsapp Clone - Part V - Transcript.pdf
Creating a Whatsapp Clone - Part V - Transcript.pdf
 
Creating a Whatsapp Clone - Part IV - Transcript.pdf
Creating a Whatsapp Clone - Part IV - Transcript.pdfCreating a Whatsapp Clone - Part IV - Transcript.pdf
Creating a Whatsapp Clone - Part IV - Transcript.pdf
 
Creating a Whatsapp Clone - Part IV.pdf
Creating a Whatsapp Clone - Part IV.pdfCreating a Whatsapp Clone - Part IV.pdf
Creating a Whatsapp Clone - Part IV.pdf
 
Creating a Whatsapp Clone - Part I - Transcript.pdf
Creating a Whatsapp Clone - Part I - Transcript.pdfCreating a Whatsapp Clone - Part I - Transcript.pdf
Creating a Whatsapp Clone - Part I - Transcript.pdf
 

Recently uploaded

"Impact of front-end architecture on development cost", Viktor Turskyi
"Impact of front-end architecture on development cost", Viktor Turskyi"Impact of front-end architecture on development cost", Viktor Turskyi
"Impact of front-end architecture on development cost", Viktor Turskyi
Fwdays
 
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
Product School
 
Essentials of Automations: Optimizing FME Workflows with Parameters
Essentials of Automations: Optimizing FME Workflows with ParametersEssentials of Automations: Optimizing FME Workflows with Parameters
Essentials of Automations: Optimizing FME Workflows with Parameters
Safe Software
 
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdfFIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance
 
Accelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish CachingAccelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish Caching
Thijs Feryn
 
JMeter webinar - integration with InfluxDB and Grafana
JMeter webinar - integration with InfluxDB and GrafanaJMeter webinar - integration with InfluxDB and Grafana
JMeter webinar - integration with InfluxDB and Grafana
RTTS
 
Leading Change strategies and insights for effective change management pdf 1.pdf
Leading Change strategies and insights for effective change management pdf 1.pdfLeading Change strategies and insights for effective change management pdf 1.pdf
Leading Change strategies and insights for effective change management pdf 1.pdf
OnBoard
 
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
UiPathCommunity
 
ODC, Data Fabric and Architecture User Group
ODC, Data Fabric and Architecture User GroupODC, Data Fabric and Architecture User Group
ODC, Data Fabric and Architecture User Group
CatarinaPereira64715
 
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Tobias Schneck
 
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered Quality
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered QualitySoftware Delivery At the Speed of AI: Inflectra Invests In AI-Powered Quality
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered Quality
Inflectra
 
The Future of Platform Engineering
The Future of Platform EngineeringThe Future of Platform Engineering
The Future of Platform Engineering
Jemma Hussein Allen
 
Connector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a buttonConnector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a button
DianaGray10
 
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
James Anderson
 
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdfFIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance
 
Bits & Pixels using AI for Good.........
Bits & Pixels using AI for Good.........Bits & Pixels using AI for Good.........
Bits & Pixels using AI for Good.........
Alison B. Lowndes
 
How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...
Product School
 
Knowledge engineering: from people to machines and back
Knowledge engineering: from people to machines and backKnowledge engineering: from people to machines and back
Knowledge engineering: from people to machines and back
Elena Simperl
 
UiPath Test Automation using UiPath Test Suite series, part 3
UiPath Test Automation using UiPath Test Suite series, part 3UiPath Test Automation using UiPath Test Suite series, part 3
UiPath Test Automation using UiPath Test Suite series, part 3
DianaGray10
 
To Graph or Not to Graph Knowledge Graph Architectures and LLMs
To Graph or Not to Graph Knowledge Graph Architectures and LLMsTo Graph or Not to Graph Knowledge Graph Architectures and LLMs
To Graph or Not to Graph Knowledge Graph Architectures and LLMs
Paul Groth
 

Recently uploaded (20)

"Impact of front-end architecture on development cost", Viktor Turskyi
"Impact of front-end architecture on development cost", Viktor Turskyi"Impact of front-end architecture on development cost", Viktor Turskyi
"Impact of front-end architecture on development cost", Viktor Turskyi
 
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
 
Essentials of Automations: Optimizing FME Workflows with Parameters
Essentials of Automations: Optimizing FME Workflows with ParametersEssentials of Automations: Optimizing FME Workflows with Parameters
Essentials of Automations: Optimizing FME Workflows with Parameters
 
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdfFIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
 
Accelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish CachingAccelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish Caching
 
JMeter webinar - integration with InfluxDB and Grafana
JMeter webinar - integration with InfluxDB and GrafanaJMeter webinar - integration with InfluxDB and Grafana
JMeter webinar - integration with InfluxDB and Grafana
 
Leading Change strategies and insights for effective change management pdf 1.pdf
Leading Change strategies and insights for effective change management pdf 1.pdfLeading Change strategies and insights for effective change management pdf 1.pdf
Leading Change strategies and insights for effective change management pdf 1.pdf
 
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
 
ODC, Data Fabric and Architecture User Group
ODC, Data Fabric and Architecture User GroupODC, Data Fabric and Architecture User Group
ODC, Data Fabric and Architecture User Group
 
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
 
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered Quality
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered QualitySoftware Delivery At the Speed of AI: Inflectra Invests In AI-Powered Quality
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered Quality
 
The Future of Platform Engineering
The Future of Platform EngineeringThe Future of Platform Engineering
The Future of Platform Engineering
 
Connector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a buttonConnector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a button
 
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
 
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdfFIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
 
Bits & Pixels using AI for Good.........
Bits & Pixels using AI for Good.........Bits & Pixels using AI for Good.........
Bits & Pixels using AI for Good.........
 
How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...
 
Knowledge engineering: from people to machines and back
Knowledge engineering: from people to machines and backKnowledge engineering: from people to machines and back
Knowledge engineering: from people to machines and back
 
UiPath Test Automation using UiPath Test Suite series, part 3
UiPath Test Automation using UiPath Test Suite series, part 3UiPath Test Automation using UiPath Test Suite series, part 3
UiPath Test Automation using UiPath Test Suite series, part 3
 
To Graph or Not to Graph Knowledge Graph Architectures and LLMs
To Graph or Not to Graph Knowledge Graph Architectures and LLMsTo Graph or Not to Graph Knowledge Graph Architectures and LLMs
To Graph or Not to Graph Knowledge Graph Architectures and LLMs
 

Creating a Facebook Clone - Part XVI.pdf

  • 1. Creating a Facebook Clone - Part XV
  • 2. © Codename One 2017 all rights reserved
  • 3. public class NewPostForm extends Form { private static final String[] POST_STYLES = { "Label", "PostStyleHearts", "PostStyleHands", "PostStyleBlack", "PostStyleRed", "PostStylePurple" }; public NewPostForm() { super("Create Post", new BorderLayout()); Form current = getCurrentForm(); getToolbar().setBackCommand("Cancel", Toolbar.BackCommandPolicy. WHEN_USES_TITLE_OTHERWISE_ARROW, e -> current.showBack()); getToolbar().addMaterialCommandToRightBar("", FontImage.MATERIAL_DONE, e -> {}); User me = ServerAPI.me(); Container userSettings = BorderLayout.west( new Label(me.getAvatar(6.5f), "HalfPaddedContainer")); Button friends = new Button("Friends", "FriendCombo"); FontImage.setMaterialIcon(friends, FontImage.MATERIAL_PEOPLE); userSettings.add(CENTER, BoxLayout.encloseY( new Label(me.fullName(), "MultiLine1"), NewPostForm
  • 4. public class NewPostForm extends Form { private static final String[] POST_STYLES = { "Label", "PostStyleHearts", "PostStyleHands", "PostStyleBlack", "PostStyleRed", "PostStylePurple" }; public NewPostForm() { super("Create Post", new BorderLayout()); Form current = getCurrentForm(); getToolbar().setBackCommand("Cancel", Toolbar.BackCommandPolicy. WHEN_USES_TITLE_OTHERWISE_ARROW, e -> current.showBack()); getToolbar().addMaterialCommandToRightBar("", FontImage.MATERIAL_DONE, e -> {}); User me = ServerAPI.me(); Container userSettings = BorderLayout.west( new Label(me.getAvatar(6.5f), "HalfPaddedContainer")); Button friends = new Button("Friends", "FriendCombo"); FontImage.setMaterialIcon(friends, FontImage.MATERIAL_PEOPLE); userSettings.add(CENTER, BoxLayout.encloseY( new Label(me.fullName(), "MultiLine1"), NewPostForm
  • 5. public class NewPostForm extends Form { private static final String[] POST_STYLES = { "Label", "PostStyleHearts", "PostStyleHands", "PostStyleBlack", "PostStyleRed", "PostStylePurple" }; public NewPostForm() { super("Create Post", new BorderLayout()); Form current = getCurrentForm(); getToolbar().setBackCommand("Cancel", Toolbar.BackCommandPolicy. WHEN_USES_TITLE_OTHERWISE_ARROW, e -> current.showBack()); getToolbar().addMaterialCommandToRightBar("", FontImage.MATERIAL_DONE, e -> {}); User me = ServerAPI.me(); Container userSettings = BorderLayout.west( new Label(me.getAvatar(6.5f), "HalfPaddedContainer")); Button friends = new Button("Friends", "FriendCombo"); FontImage.setMaterialIcon(friends, FontImage.MATERIAL_PEOPLE); userSettings.add(CENTER, BoxLayout.encloseY( new Label(me.fullName(), "MultiLine1"), NewPostForm
  • 6. public class NewPostForm extends Form { private static final String[] POST_STYLES = { "Label", "PostStyleHearts", "PostStyleHands", "PostStyleBlack", "PostStyleRed", "PostStylePurple" }; public NewPostForm() { super("Create Post", new BorderLayout()); Form current = getCurrentForm(); getToolbar().setBackCommand("Cancel", Toolbar.BackCommandPolicy. WHEN_USES_TITLE_OTHERWISE_ARROW, e -> current.showBack()); getToolbar().addMaterialCommandToRightBar("", FontImage.MATERIAL_DONE, e -> {}); User me = ServerAPI.me(); Container userSettings = BorderLayout.west( new Label(me.getAvatar(6.5f), "HalfPaddedContainer")); Button friends = new Button("Friends", "FriendCombo"); FontImage.setMaterialIcon(friends, FontImage.MATERIAL_PEOPLE); userSettings.add(CENTER, BoxLayout.encloseY( new Label(me.fullName(), "MultiLine1"), NewPostForm
  • 7. public class NewPostForm extends Form { private static final String[] POST_STYLES = { "Label", "PostStyleHearts", "PostStyleHands", "PostStyleBlack", "PostStyleRed", "PostStylePurple" }; public NewPostForm() { super("Create Post", new BorderLayout()); Form current = getCurrentForm(); getToolbar().setBackCommand("Cancel", Toolbar.BackCommandPolicy. WHEN_USES_TITLE_OTHERWISE_ARROW, e -> current.showBack()); getToolbar().addMaterialCommandToRightBar("", FontImage.MATERIAL_DONE, e -> {}); User me = ServerAPI.me(); Container userSettings = BorderLayout.west( new Label(me.getAvatar(6.5f), "HalfPaddedContainer")); Button friends = new Button("Friends", "FriendCombo"); FontImage.setMaterialIcon(friends, FontImage.MATERIAL_PEOPLE); userSettings.add(CENTER, BoxLayout.encloseY( new Label(me.fullName(), "MultiLine1"), NewPostForm
  • 8. e -> current.showBack()); getToolbar().addMaterialCommandToRightBar("", FontImage.MATERIAL_DONE, e -> {}); User me = ServerAPI.me(); Container userSettings = BorderLayout.west( new Label(me.getAvatar(6.5f), "HalfPaddedContainer")); Button friends = new Button("Friends", "FriendCombo"); FontImage.setMaterialIcon(friends, FontImage.MATERIAL_PEOPLE); userSettings.add(CENTER, BoxLayout.encloseY( new Label(me.fullName(), "MultiLine1"), FlowLayout.encloseIn(friends))); add(NORTH, userSettings); TextArea post = new TextArea(3, 80); post.setUIID("Label"); post.setGrowByContent(false); Container postStyles = createPostStyles(post); add(CENTER, LayeredLayout.encloseIn( BorderLayout.north(post), BorderLayout.south(postStyles))); setEditOnShow(post); } private Container createPostStyles(TextArea post) { Container postStyles = new Container(BoxLayout.x()); NewPostForm
  • 9. e -> current.showBack()); getToolbar().addMaterialCommandToRightBar("", FontImage.MATERIAL_DONE, e -> {}); User me = ServerAPI.me(); Container userSettings = BorderLayout.west( new Label(me.getAvatar(6.5f), "HalfPaddedContainer")); Button friends = new Button("Friends", "FriendCombo"); FontImage.setMaterialIcon(friends, FontImage.MATERIAL_PEOPLE); userSettings.add(CENTER, BoxLayout.encloseY( new Label(me.fullName(), "MultiLine1"), FlowLayout.encloseIn(friends))); add(NORTH, userSettings); TextArea post = new TextArea(3, 80); post.setUIID("Label"); post.setGrowByContent(false); Container postStyles = createPostStyles(post); add(CENTER, LayeredLayout.encloseIn( BorderLayout.north(post), BorderLayout.south(postStyles))); setEditOnShow(post); } private Container createPostStyles(TextArea post) { Container postStyles = new Container(BoxLayout.x()); NewPostForm
  • 10. setEditOnShow(post); } private Container createPostStyles(TextArea post) { Container postStyles = new Container(BoxLayout.x()); postStyles.setScrollableX(true); int size = convertToPixels(8); ButtonGroup bg = new ButtonGroup(); for(String s : POST_STYLES) { Button postStyleButton = RadioButton.createToggle("", bg); postStyleButton.setShowEvenIfBlank(true); postStyleButton.setUIID(s); Style stl = postStyleButton.getAllStyles(); stl.setBorder(RoundRectBorder.create()); stl.setPadding(3, 3, 3, 3); stl.setMarginUnit(Style.UNIT_TYPE_DIPS); stl.setMargin(1, 1, 1, 1); int strokeColor = 0xffffff; if(s.equals("Label")) { stl.setBgTransparency(255); stl.setBgColor(0xffffff); strokeColor = 0; } postStyleButton.getPressedStyle().setBorder(RoundRectBorder. NewPostForm
  • 11. setEditOnShow(post); } private Container createPostStyles(TextArea post) { Container postStyles = new Container(BoxLayout.x()); postStyles.setScrollableX(true); int size = convertToPixels(8); ButtonGroup bg = new ButtonGroup(); for(String s : POST_STYLES) { Button postStyleButton = RadioButton.createToggle("", bg); postStyleButton.setShowEvenIfBlank(true); postStyleButton.setUIID(s); Style stl = postStyleButton.getAllStyles(); stl.setBorder(RoundRectBorder.create()); stl.setPadding(3, 3, 3, 3); stl.setMarginUnit(Style.UNIT_TYPE_DIPS); stl.setMargin(1, 1, 1, 1); int strokeColor = 0xffffff; if(s.equals("Label")) { stl.setBgTransparency(255); stl.setBgColor(0xffffff); strokeColor = 0; } postStyleButton.getPressedStyle().setBorder(RoundRectBorder. NewPostForm
  • 12. setEditOnShow(post); } private Container createPostStyles(TextArea post) { Container postStyles = new Container(BoxLayout.x()); postStyles.setScrollableX(true); int size = convertToPixels(8); ButtonGroup bg = new ButtonGroup(); for(String s : POST_STYLES) { Button postStyleButton = RadioButton.createToggle("", bg); postStyleButton.setShowEvenIfBlank(true); postStyleButton.setUIID(s); Style stl = postStyleButton.getAllStyles(); stl.setBorder(RoundRectBorder.create()); stl.setPadding(3, 3, 3, 3); stl.setMarginUnit(Style.UNIT_TYPE_DIPS); stl.setMargin(1, 1, 1, 1); int strokeColor = 0xffffff; if(s.equals("Label")) { stl.setBgTransparency(255); stl.setBgColor(0xffffff); strokeColor = 0; } postStyleButton.getPressedStyle().setBorder(RoundRectBorder. NewPostForm
  • 13. private Container createPostStyles(TextArea post) { Container postStyles = new Container(BoxLayout.x()); postStyles.setScrollableX(true); int size = convertToPixels(8); ButtonGroup bg = new ButtonGroup(); for(String s : POST_STYLES) { Button postStyleButton = RadioButton.createToggle("", bg); postStyleButton.setShowEvenIfBlank(true); postStyleButton.setUIID(s); Style stl = postStyleButton.getAllStyles(); stl.setBorder(RoundRectBorder.create()); stl.setPadding(3, 3, 3, 3); stl.setMarginUnit(Style.UNIT_TYPE_DIPS); stl.setMargin(1, 1, 1, 1); int strokeColor = 0xffffff; if(s.equals("Label")) { stl.setBgTransparency(255); stl.setBgColor(0xffffff); strokeColor = 0; } postStyleButton.getPressedStyle().setBorder(RoundRectBorder. create().strokeColor(strokeColor). strokeOpacity(255). stroke(0.5f, true)); postStyleButton.addActionListener(e -> changeStyle(post, s)); NewPostForm
  • 14. private Container createPostStyles(TextArea post) { Container postStyles = new Container(BoxLayout.x()); postStyles.setScrollableX(true); int size = convertToPixels(8); ButtonGroup bg = new ButtonGroup(); for(String s : POST_STYLES) { Button postStyleButton = RadioButton.createToggle("", bg); postStyleButton.setShowEvenIfBlank(true); postStyleButton.setUIID(s); Style stl = postStyleButton.getAllStyles(); stl.setBorder(RoundRectBorder.create()); stl.setPadding(3, 3, 3, 3); stl.setMarginUnit(Style.UNIT_TYPE_DIPS); stl.setMargin(1, 1, 1, 1); int strokeColor = 0xffffff; if(s.equals("Label")) { stl.setBgTransparency(255); stl.setBgColor(0xffffff); strokeColor = 0; } postStyleButton.getPressedStyle().setBorder(RoundRectBorder. create().strokeColor(strokeColor). strokeOpacity(255). stroke(0.5f, true)); postStyleButton.addActionListener(e -> changeStyle(post, s)); NewPostForm
  • 15. private Container createPostStyles(TextArea post) { Container postStyles = new Container(BoxLayout.x()); postStyles.setScrollableX(true); int size = convertToPixels(8); ButtonGroup bg = new ButtonGroup(); for(String s : POST_STYLES) { Button postStyleButton = RadioButton.createToggle("", bg); postStyleButton.setShowEvenIfBlank(true); postStyleButton.setUIID(s); Style stl = postStyleButton.getAllStyles(); stl.setBorder(RoundRectBorder.create()); stl.setPadding(3, 3, 3, 3); stl.setMarginUnit(Style.UNIT_TYPE_DIPS); stl.setMargin(1, 1, 1, 1); int strokeColor = 0xffffff; if(s.equals("Label")) { stl.setBgTransparency(255); stl.setBgColor(0xffffff); strokeColor = 0; } postStyleButton.getPressedStyle().setBorder(RoundRectBorder. create().strokeColor(strokeColor). strokeOpacity(255). stroke(0.5f, true)); postStyleButton.addActionListener(e -> changeStyle(post, s)); NewPostForm
  • 16. private Container createPostStyles(TextArea post) { Container postStyles = new Container(BoxLayout.x()); postStyles.setScrollableX(true); int size = convertToPixels(8); ButtonGroup bg = new ButtonGroup(); for(String s : POST_STYLES) { Button postStyleButton = RadioButton.createToggle("", bg); postStyleButton.setShowEvenIfBlank(true); postStyleButton.setUIID(s); Style stl = postStyleButton.getAllStyles(); stl.setBorder(RoundRectBorder.create()); stl.setPadding(3, 3, 3, 3); stl.setMarginUnit(Style.UNIT_TYPE_DIPS); stl.setMargin(1, 1, 1, 1); int strokeColor = 0xffffff; if(s.equals("Label")) { stl.setBgTransparency(255); stl.setBgColor(0xffffff); strokeColor = 0; } postStyleButton.getPressedStyle().setBorder(RoundRectBorder. create().strokeColor(strokeColor). strokeOpacity(255). stroke(0.5f, true)); postStyleButton.addActionListener(e -> changeStyle(post, s)); NewPostForm
  • 17. Button postStyleButton = RadioButton.createToggle("", bg); postStyleButton.setShowEvenIfBlank(true); postStyleButton.setUIID(s); Style stl = postStyleButton.getAllStyles(); stl.setBorder(RoundRectBorder.create()); stl.setPadding(3, 3, 3, 3); stl.setMarginUnit(Style.UNIT_TYPE_DIPS); stl.setMargin(1, 1, 1, 1); int strokeColor = 0xffffff; if(s.equals("Label")) { stl.setBgTransparency(255); stl.setBgColor(0xffffff); strokeColor = 0; } postStyleButton.getPressedStyle().setBorder(RoundRectBorder. create().strokeColor(strokeColor). strokeOpacity(255). stroke(0.5f, true)); postStyleButton.addActionListener(e -> changeStyle(post, s)); postStyleButton.setPreferredSize(new Dimension(size, size)); postStyles.add(postStyleButton); } return postStyles; } NewPostForm
  • 18. Button postStyleButton = RadioButton.createToggle("", bg); postStyleButton.setShowEvenIfBlank(true); postStyleButton.setUIID(s); Style stl = postStyleButton.getAllStyles(); stl.setBorder(RoundRectBorder.create()); stl.setPadding(3, 3, 3, 3); stl.setMarginUnit(Style.UNIT_TYPE_DIPS); stl.setMargin(1, 1, 1, 1); int strokeColor = 0xffffff; if(s.equals("Label")) { stl.setBgTransparency(255); stl.setBgColor(0xffffff); strokeColor = 0; } postStyleButton.getPressedStyle().setBorder(RoundRectBorder. create().strokeColor(strokeColor). strokeOpacity(255). stroke(0.5f, true)); postStyleButton.addActionListener(e -> changeStyle(post, s)); postStyleButton.setPreferredSize(new Dimension(size, size)); postStyles.add(postStyleButton); } return postStyles; } NewPostForm
  • 19. } postStyleButton.getPressedStyle().setBorder(RoundRectBorder. create().strokeColor(strokeColor). strokeOpacity(255). stroke(0.5f, true)); postStyleButton.addActionListener(e -> changeStyle(post, s)); postStyleButton.setPreferredSize(new Dimension(size, size)); postStyles.add(postStyleButton); } return postStyles; } private void changeStyle(TextArea post, String s) { if(s.equals("Label")) { post.setUIID(s); post.getParent().setUIID("Container"); } else { post.setUIID("PostStyleText"); post.getParent().setUIID(s); } revalidate(); } } NewPostForm
  • 20. } postStyleButton.getPressedStyle().setBorder(RoundRectBorder. create().strokeColor(strokeColor). strokeOpacity(255). stroke(0.5f, true)); postStyleButton.addActionListener(e -> changeStyle(post, s)); postStyleButton.setPreferredSize(new Dimension(size, size)); postStyles.add(postStyleButton); } return postStyles; } private void changeStyle(TextArea post, String s) { if(s.equals("Label")) { post.setUIID(s); post.getParent().setUIID("Container"); } else { post.setUIID("PostStyleText"); post.getParent().setUIID(s); } revalidate(); } } NewPostForm
  • 21. } postStyleButton.getPressedStyle().setBorder(RoundRectBorder. create().strokeColor(strokeColor). strokeOpacity(255). stroke(0.5f, true)); postStyleButton.addActionListener(e -> changeStyle(post, s)); postStyleButton.setPreferredSize(new Dimension(size, size)); postStyles.add(postStyleButton); } return postStyles; } private void changeStyle(TextArea post, String s) { if(s.equals("Label")) { post.setUIID(s); post.getParent().setUIID("Container"); } else { post.setUIID("PostStyleText"); post.getParent().setUIID(s); } revalidate(); } } NewPostForm
  • 22. } if(p.comments.size() > 0) { stats.add(EAST, new Label(p.comments.size() + " comments", "SmallLabel")); } return stats; } private Container createPostBar() { Button avatar = new Button(ServerAPI.me().getAvatar(6.5f), "Label"); Button writePost = new Button("What's on your mind?", "NewPostButton"); Button gallery = new Button("Photo", "GalleryButton"); FontImage.setMaterialIcon(gallery, FontImage.MATERIAL_PHOTO_LIBRARY, 2.9f); gallery.setTextPosition(BOTTOM); Container c = BorderLayout. centerEastWest(writePost, gallery, avatar); c.setUIID("HalfPaddedContainer"); writePost.addActionListener(e -> new NewPostForm().show()); return c; } } NewsfeedContainer
  • 23. FriendCombo { padding: 2mm; margin: 1mm; border-radius: 1mm; border-width: 1px; border-color: gray; background: transparent; color: gray; font-family: "native:MainLight"; font-size: 2.6mm; } PostStyleBase { background-color: black; color: white; padding: 3mm; text-align: center; font-family: "native:MainRegular"; font-size: 4.5mm; } PostStyleHearts { cn1-derive: PostStyleBase; theme.css
  • 24. FriendCombo { padding: 2mm; margin: 1mm; border-radius: 1mm; border-width: 1px; border-color: gray; background: transparent; color: gray; font-family: "native:MainLight"; font-size: 2.6mm; } PostStyleBase { background-color: black; color: white; padding: 3mm; text-align: center; font-family: "native:MainRegular"; font-size: 4.5mm; } PostStyleHearts { cn1-derive: PostStyleBase; theme.css
  • 25. padding: 3mm; text-align: center; font-family: "native:MainRegular"; font-size: 4.5mm; } PostStyleHearts { cn1-derive: PostStyleBase; background-image: url(images/hearts.jpg); cn1-source-dpi: 0; cn1-background-type: cn1-image-scaled-fill; } PostStyleHands { cn1-derive: PostStyleBase; background-image: url(images/hands.jpg); cn1-source-dpi: 0; cn1-background-type: cn1-image-scaled-fit; background: #243761; } PostStyleBlack { cn1-derive: PostStyleBase; } PostStyleRed { cn1-derive: PostStyleBase; background: red; theme.css
  • 26. cn1-source-dpi: 0; cn1-background-type: cn1-image-scaled-fill; } PostStyleHands { cn1-derive: PostStyleBase; background-image: url(images/hands.jpg); cn1-source-dpi: 0; cn1-background-type: cn1-image-scaled-fit; background: #243761; } PostStyleBlack { cn1-derive: PostStyleBase; } PostStyleRed { cn1-derive: PostStyleBase; background: red; } PostStylePurple { cn1-derive: PostStyleBase; background: #c600ff; } PostStyleText { background: transparent; color: white; theme.css
  • 27. background-image: url(images/hands.jpg); cn1-source-dpi: 0; cn1-background-type: cn1-image-scaled-fit; background: #243761; } PostStyleBlack { cn1-derive: PostStyleBase; } PostStyleRed { cn1-derive: PostStyleBase; background: red; } PostStylePurple { cn1-derive: PostStyleBase; background: #c600ff; } PostStyleText { background: transparent; color: white; padding: 1.5mm; text-align: center; font-family: "native:MainRegular"; font-size: 3.5mm; } theme.css
  • 28. background-image: url(images/hands.jpg); cn1-source-dpi: 0; cn1-background-type: cn1-image-scaled-fit; background: #243761; } PostStyleBlack { cn1-derive: PostStyleBase; } PostStyleRed { cn1-derive: PostStyleBase; background: red; } PostStylePurple { cn1-derive: PostStyleBase; background: #c600ff; } PostStyleText { background: transparent; color: white; padding: 1.5mm; text-align: center; font-family: "native:MainRegular"; font-size: 3.5mm; } theme.css